JavaScript——流程控制（包括：顺序结构、分支结构（if、if else、if else if、三元表达式、switch）、循环结构（for、while、do while）、continue等

流程控制

• 流程控制就是来控制我们的代码按照什么结构顺序来执行。

• 流程控制主要有以下三种结构，分别是：

  （1）顺序结构

  （2）分支结构

  （3）循环结构

顺序流程控制

• 顺序结构是程序中最简单、最基本的流程控制，它没有特定的语法结构，程序会按照代码的先后顺序，依次执行。

分支流程控制

• 由上到下执行代码的过程中，根据不同的条件，执行不同的路径代码，从而得到不同的结果。

1.if分支语句

//if分支语句的语法结构如下：
//条件成立执行代码，否则什么也不做
if(条件表达式){
	//条件成立执行的代码语句
}

2.if else双分支语句

//if else双分支语句的语法格式如下：
//条件成立执行if里面的代码，否则执行else里面的代码
if(条件表达式){
  //条件成立执行的代码
}else{
  //条件不成立执行的代码
}

3.if else if多分支语句

//if else if多分支语句的语法格式如下：
//适合检查多重条件
if(条件表达式1){
  语句1;
}else if(条件表达式2){
  语句2;
}else if(条件表达式3){
  语句3;
  ...
}else{
  //上述条件都不成立时执行此代码
}

4.三元表达式

• 由三元运算符组成的式子就称为三元表达式（因为三元表达式也是表达式，所以会有返回结果）。

//三元不等式的语法机构如下：
条件表达式 ？ 表达式1 ： 表达式2;
//如果条件表达式的结果为真，则返回表达式1点值；而如果条件表达式的结果为假，则返回表达式2的值。

5.switch语句

• switch语句也是多分支语句，它用于基于不同的条件来执行不同的代码。当要针对变量设置一系列的特定值的选项时，就可以使用switch。

//switch语句的语法格式如下：
switch(表达式){
  case value1:
    //表达式等于value1时要执行的代码
    break;
  case value2:
    //表达式等于value2时要执行的代码
    break;
  default:
    //表达式不等于任何一个value值时要执行的代码
}

• switch语句中的条件表达式我们经常写成变量的形式。
• 表达式的值与value的值相匹配时，要求值和数据类型一致才算匹配成功。
• 如果当前case里面没有break，则不回退出switch语句，而是继续执行下一个case，直到遇到break或执行default语句才退出switch语句。

6.switch语句和if else if语句的区别

• 一般情况下，它们两个语句可以相互替换。
• switch…case语句通常处理case为比较确定值的情况，而if…else…语句更加灵活，常用于范围判断（大于、等于某个范围）。
• switch语句进行条件判断后直接执行到程序的条件语句，而if…else…语句有几种条件，就得判断几次（从上到下依次判断）。
• 当分支比较少时，if…else…语句的执行效率比switch语句更高。
• 当分支比较多时，switch语句的执行效率比if…else…语句更高，结构也更清晰。

循环流程控制

• 目的：重复执行某些代码。

• 在JS中，主要有以下三种类型的循环语句：

  （1）for循环

  （2）while循环

  （3）do…while循环

1.for循环

• 在程序中，一组被重复执行的语句被称为循环体，而能否继续重复执行，则取决于循环的终止条件。
• 循环语句是指由循环体和循环的终止条件造成的句子。
• for循环主要用于把某些代码循环若干次，通常跟计数有关系。

//for循环的语法结构如下：
for(初始化变量;条件表达式;操作表达式){
  //循环体
}
//初始化变量：其实就是用var声明一个普通的变量，并且这个变量通常是作为计数器使用。
//条件表达式：用来决定每一次循环是否继续执行，也就是循环的终止条件。
//操作表达式：每次循环最后执行的代码，经常用于更新计数器（递增或递减）。

• for循环可以重复执行相同的代码。
• 因为有计数器的存在，使用for循环可以重复执行不同代码。

for(var i = 1; i <= 31; i++){
  console.log('今天是5月'+i+'日了！');
}

• 因为有计数器的存在，使用for循环可以重复执行某些操作，比如：算数运算。

var sum = 0;
for(var i = 1; i <= 10; i++){
  sum+=i;
}
console.log(sum);

• 循环嵌套是指在一个循环语句中再定义一个循环语句的语法结构。像在一个for循环语句中， 再嵌套一个for循环，我们就称之为双重for循环。

for(var i = 1; i <= 3; i++){
  console.log('这是第'+i+'次外层循环');
  for(var j = 1; j <= 3; j++){
    console.log('这是第'+i+'次里层循环');
  }
}

2.while循环

• while语句可以在条件表达式为真的前提下，循环执行指定的一段代码，直到表达式不为真时结束循环。

//while语句的语法结构如下：
while(条件表达式){
  //循环体代码
}

3.do while循环

• do…while语句其实是while语句的一个变体。该循环会先执行一次代码块，然后对条件表达式进行判断，如果条件为真，就会重复执行循环体，否则退出循环。（do while循环语句至少执行一次循环体代码）

//do while语句的语法结构如下：
do{
  //循环体代码
}while(条件表达式);

4.小结

• 三种循环在很多情况下都是可以相互替代使用的。
• 对于计数，三者的使用基本相同，但是更常用的还是for循环。
• 对于更复杂的判断条件，可以使用while和do while语句。
• while语句是先判断后执行；而do while是先执行一次后判断执行。

continue和break

1.continue关键字

• continue关键字用于立即跳出本次循环，继续下一次循环（本次循环体中continue之后的代码就会少执行一次）。

var sum = 0;
for(var i = 1; i <= 100; i++){
  if(i % 7 == 0){
    continue;
  }
  sum+=i;
}
console.log(sum);

2.break关键字

• break关键字用于立即跳出整个循环。

for(var i = 1; i <=5; i++){
  if(i == 3){
    break;
  }
  console.log('这是第'+i+'个数！');
}

Tips(断点调试)

• 断点调试是指在程序的某一行设置一个断点，调试时，程序运行到这一行就会停住，然后操作者就可以一步一步往下调试。调试过程中，可以随时看到各个变量当前的值，出错的话，调试到出错的代码行即显示错误并停下。（断点调试可以帮开发人员观察程序的运行过程）

• 注意点：

  （1）设置断点的步骤：在浏览器中按F12——>选择“sources”——>找到需要调试的文件——>在程序的某一行设置断点。

  （2）Watch（监视）的作用：通过watch，开发人员可以监视变量的值的变化。

  （3）F11键的作用：程序单步执行，让程序一行一行的执行。

---

微信公众号也会定期更新，觉得文章写得还可以的，可以加个关注！点个赞！谢谢！