JavaScript循环(for、while、do while)

1、while 循环

循环结构是指在程序中需要反复执行某个功能而设置的一种程序结构

语法：

while(条件语句){

     条件成立执行的代码

}

例：对女朋友说5句我爱你

 

// 那么既然是循环，咱们需要设定几个条件，首先是从哪开始，每完成一次要进行计数，完成多少次停止。
var i = 1;
while(i<=10){
    document.write("我爱你！");  
    i++;
}

while循环结构的具体流程：

         while循环需要我们在循环外就将变量声名好，在执行代码的过程中，一定要让变量进行变化，否则这个循环就会无休止的进行下去。

        不会停止的循环叫做死循环，程序一直不会停止，cpu占用率越来越高，很容易造成系统崩溃。所以我们在写代码的时候一定避免写成死循环。

例：利用while循环中的变量输出数字1~5

var i = 1;
while(while<=5){
     document.write(i);
    i++;
}

2、do-while 循环

        语法：

        do{

                重复的代码段

        }while(判断条件)

        do while 循环是while循环的变异体。循环流程相似，唯一不同的地方在于do while循环会先执行一次，不管条件是否成立，先执行一次，后面的流程和while循环一样。

3、for 循环

语法：

        for(声明变量并赋初始值;条件表达式;每重复一次后变量的变化规律){
            重复执行的代码块
        }
在语法中的声明变量并赋初始值，就是从哪里开始重复；条件表达式可以限定重复在什么时候停止（当条件不成立的时候）；通过每次重复变量的变化和条件表达式可以知道要重复多少次

例：输出10句“我爱你”：

for(var i = 1;i <= 10; i++){
	document.write("我爱你");
}

循环执行过程分析：

首先i=1;然后进行条件判断i<=10;条件成立，所以运行了大括号中的代码-----第一次执行 接下来i++;然后i=2;再进行条件判断i<=10;条件成立，所以又运行了大括号中的代码------第二次执行 i++;i=3;条件判断i<=10;条件成立，再次运行------第三次执行 i++;i=4;条件判断i<=10;条件成立，再次运行------第四次运行 。。。

var arr = [10,20,30,40,50];
var sum = 0;
for (var i in arr) {
	sum += arr[i];
}
alert(sum);

for循环中的初始值和变化可以不放在小括号中：

var i = 1;
for(;i<=5;){
	document.write(i);
	i++;
}

执行流程是一样的，只是写法不一样。

在循环中，变量i的变化规律可以不是递增，也可以递减，也可以不是递增1。。。总而言之，变量i的变化规律可以自定义。

例：求出1~10之间所有单数的和。

var sum = 0;
for(var i = 1;i <= 10;i+=2){
	sum += i;
}
alert(sum); // 25

for 循环的执行流程

4、循环的控制语句

continue关键字，可以跳过当前这次的循环，直接进行下一次的循环

for(var i = 1;i <= 5;i++){
	if(i == 3){
		continue; // 当i=3的时候，直接进行下一次的循环
	}
	document.write(i);
} 
// 最后结果是1245

break关键字，可终止循环，直接让整个循环结束运行。

for(var i = 1;i <= 5;i++){
	if(i == 3){
		break; // 当i=3的时候，直接结束整个循环的运行
	}
	document.write(i);
} 
// 最后结果是12

 

5、循环嵌套

九九乘法表：

<script>
    /*
        九九乘法表
    */
    document.write('<table border="1">')
    for(var i=1;i<10;i++){
        document.write('<tr>')
        for(var j=1;j<=i;j++){
            document.write('<td>')
            document.write(j +'*'+ i +'='+i*j)
            document.write('</td>')  
        }
        document.write('</tr>')
    }
    document.write('</tr>')

    
</script>