js循环结构总结

阳光穿透心脏的1/2处 2022-01-13 04:17 274阅读 0赞

## **绪论：循环五要素** ##

a、循环变量  
b、循环变量初始值  
c、循环变量终值（循环条件）  
d、循环变量增值（步长）  
e、循环体  
\*\*

## 1、循环结构while ##

\*\*  
控制语句 ：

while( 表达式 ){
        循环体;
     }

执行逻辑 ： 先判断表达式是否成立，如果成立就执行循环体，直到表达式不成立 退出循环  
/

/在浏览器中打印100个* 要求：一次打印一个
    	    var i = 1；
    	    while( i <= 100 ){
    	    	document.write ( "*" )
    	    	i++
    	    }
    	    alert("循环结束后，循环变量 i =  " + i)

## 2、do…while ##

控制语句 :

do{
        循环体
    }while( 表达式 )

![do....while语句测试][do....while]

执行逻辑 ： 先执行一次循环体 再判断表达式是否成立 ，如果不成立 退出循环，如果成立，继续执行循环体，直到表达式为假结束循环  
![执行逻辑][20190617172149256.png]  
**do…while和while区别 ：**  
do…while 先执行一次循环体 再判断表达式 循环体至少执行一次 （先执行 后判断）  
while 先判断表达式是否成立 再执行循环体 循环体可以一次也不执行 （先判断 后执行）

## 3、for循环 ##

**控制语句 ：**

for( 表达式1 ; 表达式2 ; 表达式3 ){
            循环体;
    }

![for循环的运用][for]  
**说明 ：**  
表达式1 一般为循环变量赋初始值  
表达式2 一般为循环终值（条件）  
表达式3 一般为循环变量增值（步长）

执行逻辑 ： 同while循环

**循环解决的问题 ：**  
a、**输出**问题  
b、**求和**问题 需要一个累加器 求和变量 初始值为0  
c、**计数**问题 求个数 计数器 初始值 0  
d、每几个数换行  
f、图形题 循环嵌套

## 4、break(重点) 和 continue ##

break : 中断 **结束本层循环** 循环退出 break只能出现在**switch语句**和**循环体**中  
continue ： 继续 **结束本次循环** 继续执行下一次循环 continue只能出现在**循环体**中 循环体中遇到continue，continue后面的语句不执行

![break与continue的实测][break_continue]

## 5、for 和 while 使用场景 ##

明确循环次数建议使用for  
不明确循环次数 建议使用while

[do....while]: /images/20220113/f3d61dc37cc541a199276ecb4504411a.png
[20190617172149256.png]: /images/20220113/5ac4eee0f82345d59791fbccc3e092d6.png
[for]: /images/20220113/038555e2138f47d2a02ea017d0cd6dca.png
[break_continue]: /images/20220113/cb329dbd78a44f3791565f43e24e9efa.png