JavaScript 流程控制JavaScript 提供三种流程结构, 分别是顺序, 选择, 循环.

流程控制

基本概念

JavaScript 提供三种流程结构, 分别是顺序, 选择, 循环.

顺序结构: 默认的流程结构, 按书写方式从上至下(可没说从左到右)执行每一条语句
选择结构: 对给定的条件进行判断, 再根据判断结果来决定执行哪一段代码
循环结构: 在给定条件成立的情况下, 反复执行某一段代码

选择结构

if, switch

if

第一种形式
```
if(/*条件表达式*/){
   /*条件成立执行的语句*/;
   }
```
特点: 当条件表达式为真的时候就会执行 {} 中所有的代码, 并且只会执行一次
第二种形式
```
if(/*条件表达式*/){
    /*条件成立执行的语句*/;
}else{
    /*条件不成立执行的语句*/;
}
```
特点: 当条件满足就执行 if 后面 {} 中的代码当条件不满足就执行 else 后面 {} 中的代码并且两个 {} 只有一个会被执行, 并且只会被执行一次
第三种形式
```
if(/*条件表达式A*/){
    /*条件A满足执行的语句*/;
   }else if(/*条件表达式B*/){
    /*条件B满足执行的语句*/;
   }
    ... ...
    else{
    /*前面所有条件都不满足执行的语句*/;
   }   
```
特点: 会从上至下的依次判断每一个条件表达式, 哪一个条件表达式满足, 就执行哪一个条件表达式后面 {} 中的代码如果前面所有的条件表达式都不满足, 就会执行 else 后面 {} 中的代码并且众多的大括号只有一个会被执行, 并且只会执行一次

注意点:

对于非布尔类型的数据, 会先转换成布尔类型再判断
对于 ==/=== 判断, 建议将常量写在前面, 这样可以在等号写成赋值号时及时报错, 从而避免可能的 bug
if或else if或else 后面的大括号都可以省略, 但是省略之后只有紧随其后的语句受到控制 (所以别省略!)
在 JavaScript 中分号 (;) 也是一条语句 (空语句)
if 选择结构可以嵌套使用
当 if 选择结构省略大括号时, else if或else 会自动和距离最近没有被使用的 if 匹配 (这么写代码就该开除)

最佳实践:

在企业开发中, 如果条件满足之后只有一句代码需要执行, 就使用三目运算符 如果条件满足之后有多句代码需要执行, 就使用选择结构

switch

格式: (case 有点像 else if, default 有点像 else)

switch(/*表达式*/){
    case /*表达式A*/:
        /*语句A*/;
        break; /* JS 的 break 可不能省嗷 */
    case /*表达式B*/:
        /*语句B*/;
        break;
        ... ...
        default:
        /*前面所有case都不匹配执行的代码*/;
        break;
}

特点:

会从上至下的依次判断每一个case是否和()中表达式的结果相等, 如果相等就执行对应case后面的代码, 如果前面所有的case都不匹配, 那么就会执行default后面的代码
并且所有的 case 和 default 只有一个会被执行, 并且只会被执行一次

注意点:

case 进行的是三等判断而非双等判断
switch() 的 ()中可以是常量也可以是变量还可以是表达式
case后面可以是常量也可以是变量还可以是表达式
break的作用是立即结束整个switch语句在switch语句中一旦case或者default被匹配, 其它的case和default都会失效 (js 里才是这样)
default 不一定要写在最后 switch 中的 default 无论放到什么位置, 都会等到所有 case 都不匹配再执行
和 if/else 中的 else 一样, default 也可以省略

if 还是 switch

如果是对区间进行判断, 建议使用 if
如果是对几个固定的值的判断, 建议使用 switch
原则: 能用 if 就用 if

循环结构

while, do-while, for

while

格式:

while(条件表达式){
    /*条件满足执行的语句*/;
}

特点:

只有条件表达式为真才会执行后面 {} 中的代码
大括号中的代码有可能会被执行多次

while 的执行流程

首先会判断条件表达式是否为真, 如果为真就执行后面 {} 中的代码
执行完后面 {} 中的代码, 会再次判断条件表达式是否还为真
如果条件表达式还为真, 那么会再次执行后面 {} 中的代码
重复 1~3, 直到条件表达式不为真为止

书写循环结构的规则

不管三七二十一先写上循环结构的代码
将需要重复执行的代码拷贝到 {} 中
在 () 中指定循环的结束条件

注意点:

条件表达式永远为真的循环结构称之为死循环
循环结构中的 {} 我们称之为循环体
和 if 一样对于非 boolean 类型的值, 会先转换为 boolean 类型再判断
和 if 一样, while 后如果只有一条语句它可以省略大括号
和 if 一样, 不能在 () 后面写分号 (;)
最简单死循环写法: while(1);
while 括号内不能为空, 可以为 null, 啊, 真尼玛绕啊

do-while

格式:

do{
    /*需要重复执行的代码*/;
}while(/*条件表达式*/);

特点:

无论条件表达式是否为真, 循环体都会被执行一次

while (false){
    console.log("www.it666.com");
}

do{
    console.log("www.it666.com");
}while (false);

while 还是 do-while

大部分情况下 while 循环和 do-while 循环是可以互换的
如果循环体中的代码无论如何都需要先执行一次, 使用 do-while 循环
其它的情况都建议使用 while 循环

for

格式:

for(/*初始化表达式*/; /*条件表达式*/; /*循环后增量表达式*/){
    /*需要重复执行的代码*/;
}

特点:

和 while 循环的特点一样, 只有条件表达式为真, 才会执行循环体

和 while 相比, 少写了一行用于初始化表达式的语句

// 1.初始化表达式
let num = 1;
// 2. 条件表达式
while (num <= 10){
    console.log("发射子弹" + num);
    // 3.循环后增量表达式
    num++;
}

// let num = 1;
for(let num = 1 /*1. 初始化表达式*/; num <= 10 /*2. 条件表达式*/; num++ /*3. 循环后增量表达式*/){
    console.log("发射子弹" + num);
}

for 循环的执行流程

首先会执行初始化表达式, 并且只会执行一次
判断条件表达式是否为真, 如果条件表达式为真, 就执行循环体
执行完循环体就会执行循环后增量表达式
重复 2~3, 直到条件表达式不为真为止

for 与 continue

for 循环里 break 就跳出这个循环了， continue 是略过本次执行的 continue 关键字之后的代码，

实践中在 for 里用 continue 的场景更多

注意点:

在for循环中"初始化表达式""条件表达式""循环后增量表达式"都可以不写, 如果不写就相当于while(1);
其它注意点和 while 循环一样

while 还是 for

如果是while循环, 在循环结束之后还可以使用用于控制循环结束的变量

let num = 1;
while (num <= 10){
    console.log("发射子弹" + num);
    num++;
}
console.log(num);

如果是for循环, 在循环结束之后可以让外界使用, 也可以不让外界使用

for(num = 1; num <= 10; num++){
    console.log("发射子弹" + num);
}
console.log(num); // 报错

let num = 1;
for(; num <= 10; num++){
    console.log("发射子弹" + num);
}
console.log(num); // 11

break 和 continue

break

什么是 break 关键字?
- break 关键字可以用于 switch 语句和循环结构中
- 在 switch 语句中 break 关键字的作用是立即结束==当前==的 switch 语句
- 在循环结构中 break 关键字的作用也是立即结束==当前==的循环结构
注意点
- break 关键字后面不能编写任何的语句, 因为永远执行不到
- 如果在循环嵌套的结构中, break 结束的是当前所在的循环结构(只影响一层嵌套!)

continue

什么是 continue 关键字?
- continue 关键字只能用于循环结构
- 在循环结构中 continue 关键字的作用是跳过本次循环, 进入下一次循环
continue 关键字的注意点
- continue 关键字后面和 break 一样, 不能编写其它的代码, 因为执行不到
- 和 break 一样, 如果 continue 出现在循环嵌套结构中, 只会跳过当前所在的循环

break 和 continue 区别

break 是结束当前整个循环
continue 是结束当前当次循环

循环嵌套的规律

在循环嵌套中外循环控制的是行数, 内循环控制的是列数 (当然要配合换行符)

/*

需求: 在界面中输出如下图形
*****
****
***
**
*

*/

for(let i = 0; i < 5; i++){
    console.log(i);
    for(let j = i; j < 5; j++){
        document.write("*");
    }
    document.write("<br>");
}

 /*
需求: 在界面中输出如下图形
*
**
***
****
*****

*/
for(let i = 0; i < 5; i++){
    console.log(i);
    for(let j = 0; j <= i; j++){
        document.write("*");
    }
    document.write("<br>");
}