JavaScript流程控制——循环-CSDN博客

本文链接：https://blog.csdn.net/m0_56065994/article/details/135992759

五、流程控制--循环

2.3.2 for、while和do-while的区别

3. break和continue的区别

1.for循环

1.1 语法结构

for(初始化变量;条件表达式;操作表达式){
    循环体；
}

初始化变量：通常被用于初始化一个计数器，该表达式可以使用var关键字声明新的变量，这个变量帮我们来记录次数。
条件表达式：用于确定每一次循环是否能被执行。如果结果是true就继续循环，否则退出循环。
操作表达式：每次循环的最后都要执行的表达式。通常被用于更新或者递增计数器变量。当然，递减变量也是可以的。

1.2 执行过程

初始化变量，初始化操作在整个for循环只会执行一次。
执行条件表达式，如果结果为true，则执行循环体语句，否则退出循环，循环结束。
执行操作表达式，此时第一轮结束。
第二轮开始，直接去执行条件表达式（不再初始化变量），如果为true，则执行循环体语句，否则退出循环。
继续执行操作表达式，第二轮结束。
后续跟第二轮一致，直至条件表达式为假，结束整个for循环。

1.2.1 断点调试debugger

断点调试是指自己在程序的某一行设置一个断点，调试时，程序运行到这一行就会停住，然后可以一步步往下调试，调试过程中可以看各个变量当前的值，出错的话，调试到出错的代码行即显示错语，停下。
断点调试可以帮我们观察程序的运行过程。
打开浏览器按F12---->source--->找到需要调试的文件--->单击，并在程序的某一行设置断点（刷新）Watch监视，通过watch可以监视变量的值的变化，非常的实用。F11程序一步一步执行。

1.2.2 for循环案例

案例1 输出0-10之间的整数（包含10）

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

案例2 输出0-10之间的整数和（包含10）

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

案例3 求0-10之间奇数的和

var sum=0;
for(var i=0;i<=10;i++){
    if(i%2!=0){
        sum+=i;
    }
}
console.log(sum);

案例4 盒子中有5个小球，将所有的小球取出

for(var i=1;i<=5;i++){
    console.log('第'+i+'个球');
}

1.3 双重或多重for循环

1.3.1 执行过程

for(外循环的初始值;外循环的条件;外循环的操作表达式){
    for(内循环的初始值;内循环的条件;内循环的操作表达式){
        执行的代码块;
    }
}

外层循环每执行一次，都会让内层循环执行完成一遍

例：打印直角三角形

***

*****

*******

*********

//外层循环控制行数
for(var i=1;i<=5;i++){
    //内层循环控制*的个数
    for(var j=1;j<=2*i-1;j++){
        document.write('*');
    }
    doucument.write('<br>');
}

1.4 for省略的情况

{}中只有一句代码，可以省略{}

( ; ; ;)三个条件全部都可以省略

条件1省略

var i=0;
for(;i<5;i++){
    console.log(i);
}

条件2省略

var i=0;
for(; ;i++){
    console.log(i);
    if(i==5){
        break;//结束循环
    }
    console.log(i);
}

条件3省略

var i=0;
for(  ; ; ){
    i++;
    if(i==5){
        break; //结束循环
    }
    console.log(i);
}

2. while 循环

2.1 while 循环语法结构

while(条件表达式){
   //循环体代码
}

2.2 执行过程

当循环条件为true时，则执行循环体，当循环条件为false时，结束整个循环
注意：需要在循环体中设置出口，即循环结束的条件；否则循环条件永远为true，会出现死循环

2.3 do-while循环

do{
 //循环体代码
}while(条件表达式)

2.3.1 执行过程

2.3.2 for、while和do-while的区别

for

适用于循环次数明确

while

适用于循环次数不明确

当条件不成立时，while循环不会执行一次代码块

适用于不需要至少执行一次的情况

do-while

当条件不成立时，do-while循环会执行一次代码块

适用于需要至少执行一次的情况

3. break和continue的区别

特点

共性

举例

break 中断

1.switch...case语句中，结束条件语句

2.循环中，结束当前的循环，break后面的代码不再执行

3.结束labelName这个名字的整个循环：break labelName

break和continue之后的语句不会再执行了

举例：for(var i=0;i<5;i++){
for(var j=0;j<3;j++){
if(j==1){
break;
}
console.log(i,j);//i=0、1、2、3、4，j=0
}
}
console.log(i,j);//5 1

continue 继续

循环中，结束这一次的循环，继续下次循环（循环迭代还在执行）

举例：for(var i=0;i<5;i++){
for(var j=0;j<3;j++){
if(j==1){
continue;
}
console.log(i,j);//i=0、1、2、3、4，j=0、2
}
}
console.log(i,j);//5 3