Web/03-JavaScript基础/06-流程控制语句:循环结构(for和while).md
2018-12-29 13:14:57 +08:00

266 lines
4.2 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

## 前言
循环语句:通过循环语句可以反复的执行一段代码多次。
## for循环
### for循环的结构
for循环举例
```javascript
for (var i = 1; i <= 100; i++) {
console.log(i);
}
```
上方代码的解释:
![](http://img.smyhvae.com/20180117_2248.png)
### for循环遍历
```javascript
for (var i = 1; i < 13; i = i + 4) {
console.log(i);
}
```
上方代码的遍历步骤:
```
程序一运行将执行var i = 1;这条语句, 所以i的值是1。
然后程序会验证一下i < 13是否满足1<13是真所以执行一次循环体就是大括号里面的语句
执行完循环体之后会执行i=i+4这条语句所以i的值是5。
程序会会验证一下i < 13是否满足5<13是真所以执行一次循环体就是大括号里面的语句
执行完循环体之后会执行i=i+4这条语句所以i的值是9。
程序会会验证一下i < 13是否满足9<13是真所以执行一次循环体就是大括号里面的语句
执行完循环体之后会执行i=i+4这条语句所以i的值是13。
程序会会验证一下i < 13是否满足13<13是假所以不执行循环体了将退出循环。
最终输出输出结果为1、5、9
```
接下来做几个题目。
题目1
```javascript
for (var i = 1; i < 10; i = i + 3) {
i = i + 1;
console.log(i);
}
```
输出结果2、6、10
题目2
```javascript
for (var i = 1; i <= 10; i++) {
}
console.log(i);
```
输出结果11
题目3
```javascript
for(var i = 1; i < 7; i = i + 3){
}
console.log(i);
```
输出结果7
题目4
```javascript
for (var i = 1; i > 0; i++) {
console.log(i);
}
```
死循环。
## while循环语句
### while循环
语法:
```javascript
while(条件表达式){
语句...
}
```
执行流程:
```
while语句在执行时先对条件表达式进行求值判断
如果值为true则执行循环体
循环体执行完毕以后,继续对表达式进行判断
如果为true则继续执行循环体以此类推
如果值为false则终止循环
```
**如果有必要的话,我们可以使用 break 来终止循环**
### do...while循环
语法:
```javascript
do{
语句...
}while(条件表达式)
```
执行流程:
```
do...while语句在执行时会先执行循环体
循环体执行完毕以后在对while后的条件表达式进行判断
如果结果为true则继续执行循环体执行完毕继续判断以此类推
如果结果为false则终止循环
```
### while循环和 do...while循环的区别
这两个语句的功能类似,不同的是:
- while是先判断后执行而do...while是先执行后判断。
也就是说do...while可以保证循环体至少执行一次而while不能。
### while循环举例1
**题目**假如投资的年利率为5%试求从1000块增长到5000块需要花费多少年
**代码实现**
```html
<!DOCTYPE html>
<html lang="">
<head>
<meta>
<meta>
<meta>
<title>Document</title>
</head>
<body>
<script>
/*
* 假如投资的年利率为5%试求从1000块增长到5000块需要花费多少年
*
* 1000 1000*1.05
* 1050 1050*1.05
*/
//定义一个变量,表示当前的钱数
var money = 1000;
//定义一个计数器
var count = 0;
//定义一个while循环来计算每年的钱数
while (money < 5000) {
money *= 1.05;
//使count自增
count++;
}
console.log(money);
console.log("一共需要" + count + "年");
</script>
</body>
</html>
```
打印结果:
```
5003.18854203379
一共需要33年
```
另外你也可以自己算一下假如投资的年利率为5%从1000块增长到1万块需要花费48年
```
10401.269646942128
一共需要48年
```
## 我的公众号
想学习<font color=#0000ff>**代码之外的技能**</font>?不妨关注我的微信公众号:**千古壹号**id`qianguyihao`)。
扫一扫,你将发现另一个全新的世界,而这将是一场美丽的意外:
![](http://img.smyhvae.com/2016040102.jpg)