【JS学习笔记】7.JavaScript流程控制语句-循环结构（while，do....while，for)

这部分的学习，为了更好的了解用法，大多数，都是用练习的方式来进行学习的
我在学习的过程中，都会先不看老师讲题，自己把题目写一遍，不管是例子还是练习

while循环

特点：while循环会先进行判断，之后再执行操作。

简单的例子：循环输出10次hello world

		var i=1;
		while(i<=10){
			console.log('Hello world!');
			i++;
		}

计算100以内所有整数之和

		var j=1;
		var sum=0;
		while(j<=100){
			// sum=sum+j; //累加求和
			sum+=j;
			j++;
		};
		console.log('100以内所有整数只和为'+sum);

巩固之前的学习，我们在循环体里面加入选择结构。
例：计算100以内所有奇数之和

		var i=0;
		var sum=0;
		while(i<100){
			if ((i%2)!=0) {
				sum+=i;
				i++;
			}else{
				i++;
			};

		};
		document.write('100以内所有奇数之和为' + sum);

当然如果使用三目运算会更简洁：

		var i=0;
		var sum=0;
		while(i<100){
			i%2==0?i:sum+=i;
			i++;
		};
		document.write('100以内所有奇数之和为' + sum);

do…while循环

特点：先执行操作，再进行判断。

例：

		var i=0;
		do{
			document.write('Hello World!<br />' );
			i++;
		}while(i<10);

例2：循环提示用户输入整数，直到数字为0为止，然后输出其中最大值和最小值。

		var max=min=Number(prompt('请输入一个整数：'));//假设用户输入的第一个数字，即使最大值，也是最小值
		var flag=true; //现阶段先不用break
		while(flag){
			var num=Number(prompt('请输入一个整数：'));
			if(num==0){
				flag=false;
			}else{
				if(num>max){
					max=num;
				};
				if(num<min){
					min=num;
				};
			};
		};
		document.write('最大值：' +max);
		document.write('最小值：' +min);

for循环

for循环实际也是先判断再执行的，一般循环次数如果是固定的话，使用for会更简洁。

for循环的结构：

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

执行顺序： 表达式1：参数初始化；表达式2：条件判断;表达式3：更新循环变量；

执行步骤：
1.分析循环条件和循环操作
2.套用for语法写出代码
3.检查代码是否能退出

例1：循环输入五门课程的成绩，并计算平均分

		var sum=0;
		for (var i = 0 ;i < 5; i++) {
			sum+=Number(prompt('请输入第' + (i+1)+ '门课程的成绩'));
		};
		var avg=sum/5;
		document.write('五门课平分为' + avg + '<br />');

练习作业1：
求1~100之前不能被3整除的数之和

		var sum=0;
		for(i=0;i<100;i++){
			if (i%3!=0) {
				sum +=i;
			};
		};
		document.write('1~100之前不能被3整除的数之和为' + sum + '<br />' );

练习作业2：
输入任意一个整数，根据这个值，输出加法表，假设输入值为5，输出 0+5=5,1+4=5…

		var num = Number(prompt('请输入一个整数：'));
		document.write('您输入的值为：' + num + '共可以分解为：' +'<br />' );
		for(var i=0;i<=num;i++){
			document.write(i + '+' +(num-i) + '=' + num + '<br />');
		};

break和contiue、二重循环

break：中断

• 改变程序控制流
• break通常在循环中与条件一起使用
• 用于do…while,while,for中时，可以跳出循环，而执行循环后面的语句

例：

将1~20之间的整数相加，当累加值大于20时停止相加，输出当前整数和累加值

		var sum=0;
		for(var i = 0 ; i<=10;i++){
			sum+=i;
			if (sum>20) {
				break;//停止循环的执行
				
			};
		};
		document.write('当前整数为' + i +'<br />' + '累加值为' + sum);

continue

• 只能用在循环里
• 作用：跳过循环体中剩余的语句而执行下一次循环
• 通常与条件语句一起使用，加速循环

例1：

求1~10之前所有偶数的和

		var sum=0;
		for(var i=0;i<=10;i++){
			if (i%2!=0) {		
				continue; // 如果是奇数，则跳出本次循环，不累加，执行下一次循环
			}
			sum+=i;	
		}
		document.write('1-10之前所有偶数只和为' + sum );

例2：

循环输入8个学生的成绩，统计分数大于80分的学生比例

		var count=0;
		for(var i=0;i<8;i++){
			var score=Number(prompt('请输入第' + (i+1) +'学生的成绩：'))
			if(score<=80){
				continue;
			}
			count++;
		};
		document.write('大于80分的学生比例为：' + ((count/8)*100) + '%');

无论是哪一种循环，都有4个必不可少的条件：初识部分、循环条件、循环体、迭代部分
需要多次重复执行一个或者多个任务的问题考虑使用循环进行解决。

使用情况：
循环次数确定的情况，通常使用for循环
循环次数不确定的情况，通常使用while和do…while。

二重循环

一个循环体内又包含另一个完整的循环结构。

• 外层循环执行一次的时候，内层循环已经执行了一轮。
• 各种循环可以相互嵌套。

例：

	for(var i=0;i<3;i++){//外层控制班级数目
			var sum=0;//每个班级的总分
			for(var j=0;j<4;j++){//内层控制每个班级学员的数目
				sum+=Number(prompt('请输入第' + (i+1) +'个班级' +'第' +(j+1) +'个学生的分数' ));
			};
			var avg=sum/4;
			document.write('第' +(i+1) + '个班级的平均分为：' + avg + '<br />');
	};

练习题：

练习1：根据用户输入的行数，用星号打印直角三角形（1.2.3.4.5…）
练习2：根据用户输入的行数，用星号打印直角三角形（1.3.5.7.9…）
练习3：根据用户输入的行数，用星号打印倒三角（…5,4,3,2,1）
练习4：根据用户输入的行数，用星号打印倒三角（…9,7,5,3,1）
练习5：根据用户输入的行数，用*打印等腰三角形（1.3.5.7.9）
练习6：三个班级4名学员参赛，只统计大于85分的学员数量和平均分。

练习1：

		var rows=Number(prompt('请输入您想打印的行数：'));
		for(var i =1;i<=rows;i++){
			for(var j=1;j<=i;j++){
				document.write('*');
			}
			document.write('<br/>');
		}*/

练习2：

		var rows=Number(prompt('请输入您想打印的行数：'));
		for(var i =1;i<=rows;i++){
			for(var j=1;j<=2*i-1;j++){
	
				document.write('*');
			};
			document.write('<br/>');
		}

练习3：

		var rows=Number(prompt('请输入您想打印的行数：'));
		for(var i=1;i<=rows;i++){
			for(var j=1;j<=rows-i+1;j++){
				document.write('*')
			};
			document.write('<br/>');
		}

练习4：

		var rows=Number(prompt('请输入您想打印的行数：'));
		for(var i =1;i<=rows;i++){
			for(var j=1;j<=2*(rows-i+1)-1;j++){
	
				document.write('*');
			};
			document.write('<br/>');
		}

练习5：

		var rows=Number(prompt('请输入您想打印的行数：'));
		for(var i =1;i<=rows;i++){
			//打印空格
			for(var k=1;k<=rows-i;k++){ 
					document.write('&nbsp;');
			};
			//打印星号
			for(var j=1;j<=2*i-1;j++){
				document.write('*');
			};
			document.write('<br/>');
		}

其实这里打印出来可能不是等腰三角形，因为浏览器里，空格和星号的宽度不同的，真的要成等腰三角形，因为它是网页，可以用css来居中。

练习6：

		for(i=0;i<3;i++){
			var sum=0;//统计总分
			var count=0;//统计人数
			for(j=0;j<4;j++){
				var score=Number(prompt('请输入第' + (i+1) +'个班级，第' + (j+1) +'个学生的成绩:'));
				if (score<=85) {
					continue;//跳出本次循环，不统计学生的成绩
				}		
				sum+=score;
			};
			var avg=sum/4;
			document.write('第' + (i+1) +'个班的平均分为' + avg +'，超过85分的共'+count+'个学生'+ '<br />');
		};