js循环（while循环，do while循环,for循环）相关知识点及练习
Posted ljp1997
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js循环（while循环，do while循环,for循环）相关知识点及练习相关的知识，希望对你有一定的参考价值。
08.循环
1.循环！
循环的作用：
-
简化代码，处理重复执行的代码
-
遍历数组、json对象、节点集合
2.while循环
语法：
while(循环的条件)
循环体
3.循环的五大要素
-
循环变量
-
循环变量的初始化
-
循环的增值
-
循环的终止条件
-
循环体
eg:在页面中打印100句“我爱你！！”;
方法一：
var i = 1; //循环变量 以及 循环变量的初始值
while (i <= 100) //循环的终止条件
document.write("我爱你" + i + "<br>");
i++; //循环变量的增值
方法二：
var i =1; //循环变量以及初始值
while(true)
document.write("我爱你啊" + i + "<br>");
i++;
//终止条件
if(i > 100)
break;
09.while循环案例
1.怎么实现1-50的和？
<script>
var i = 1;
var sum = 0;
while(i <= 50)
sum += i;
i++;
console.log(sum);
</script>
2.打印100以内7的倍数
var i = 1;
while(i <= 100)
if(i % 7 == 0 )
console.log(i);
i++;
3.打印100以内的奇数
var i = 1 ;
while(true)
if(i % 2 != 0)
console.log(i);
i++;
if( i > 100 )
break;
4.打印100以内所有偶数的和
var i = 1 ;
var sum = 0;
while( i <= 100 )
if( i % 2 == 0 )
sum += i;
i++;
console.log(sum);
1.案例：输入分数，判定成绩等级 优 良 中 差
var num = 100;
if( num <= 100 && num > 90 )
console.log("优")
else if(num <= 90 && num > 80)
console.log("liang")
else if( num <= 80 && num > 70 )
console.log("zhong")
else
console.log("差")
2.输入月份，显示当月的天数 case穿透
分析：1 3 5 7 8 10 12 31天
var month = 2;
switch(month)
// case 1 : console.log("31天");
// break;
// case 2 : console.log("28天");
// break;
// case 3 : console.log("31天");
case 1 :
case 3 :
case 5 :
case 7 :
case 8 :
case 10 :
case 12 :
console.log("31天");
break;
case 4 :
case 6 :
case 9 :
case 11 :
console.log("30天");
break;
?
case 2 : console.log("28天");
break;
default : console.log("输入错误...");
while的执行逻辑：
首先先进行变量的判断，如果不满足则不进入循环体，如果满足，则进入循环体，循环执行完毕，变量的增值，再进行条件的判断...
do while 的执行逻辑：
首先先进入循环体，执行一次，然后再进行变量的自增，然后再次判断.....
eg:
var i = 10;
while(i < 15)
console.log(i);
i++;
练习：入职薪水10k，每年涨幅5%，50年后工资多少?
var money = 10000;
var year = 1;
do
//循环体
money *= 1.05;
year++;
while(year <= 50);
console.log(money);
02.for循环
for循环的执行逻辑：
首先先声明循环变量，为变量赋值，然后进行条件判断。如果条件成立则进入循环体，循环体执行完毕，循环变量增值，自增之后再次对条件进行判断.....
for(语句1,语句2,语句3)
//循环体
语句1：循环变量 以及 初始值
语句2：循环的终止条件
语句3：循环变量的增值
eg:
for(var i = 0 ; i < 10 ; i++)
console.log(i);
练习：
1.打印100-200之间所有能被3或者7整除的数
for(var i = 100 ; i <= 200 ; i++)
if(i % 3 == 0 || i % 7 == 0)
console.log(i);
2.计算100的阶乘
var product = 1;
for(var i = 1 ; i <= 100 ; i++)
product *= i;
console.log(product);
03.循环嵌套
1.实现表格:
<style>
td
width:100px;
height:30px;
border:2px solid red;
</style>
?
<script>
document.write("<table>");
for(var i = 0 ; i < 10 ; i++)
document.write("<tr>");
//打印的td
for(var k = 0 ; k < 10 ; k++)
document.write("<td></td>");
document.write("</tr>");
document.write("</table>");
</script>
2.九九乘法表:
for(var i = 1 ; i <= 9 ; i++)
for(var j = 1 ; j <= i ;j++)
document.write(j + "*" + i + "=" + i * j + " ");
document.write("<br><br>")
04.循环练习
1.打印100以内所有偶数的和
var sum = 0;
for(var i = 1 ; i <= 100 ; i++)
if(i % 2 == 0)
sum += i;
document.write("sum");
2.打印出1000-2000年中所有的闰年，并以每行四个数的形式输出（闰年条件：非整百年，被4整除，或者被400整除）
var count = 0;
for(var i = 1000 ; i <= 2000 ; i++)
if(i % 100 !== 0 && i % 4 == 0 || i % 400 == 0)
document.write(i + " ");
//每打印一个闰年，计数器加1，当计数器能被4整除的时候，打印一个换行
count++;
if(count % 4 == 0)
document.write("<br>");
3.打印直角三角形(5行)
<style>
*
margin:0;
padding:0;
div
width:10px;
height:10px;
background:red;
margin:10px;
display:inline-block;//让显示在同一行
</style>
<script>
for(var i = 1 ; i <= 5 ; i++)
for(var k = 1 ; k <= i ; k++)
document.write("<div></div>" + " ");
document.write("<br>");
</script>
4.打印等腰三角形:
<style>
*
margin:0;
padding:0;
div
width:10px;
height:10px;
background:red;
margin:10px;
display:inline-block;//让显示在同一行
span
width:10px;
height:10px;
//background:green;
display:inline