【JS中循环嵌套常见的六⼤经典例题+六⼤图形题，你知道哪⼏
个？】
⾸先，了解⼀下循环嵌套的特点：外层循环转⼀次，内层循环转⼀圈。
在上⼀篇随笔中详细介绍了JS中的分⽀结构和循环结构，我们来简单的回顾⼀下For循环结构：
1、for循环有三个表达式，分别为：
①定义循环变量
②判断循环条件
③更新循环变量（三个表达式之间，⽤；分隔。）
for循环三个表达式可以省略，两个；缺⼀不可
2、for循环特点：先判断，再执⾏；
3、for循环三个表达式，均可以有多部分组成，之间⽤逗号分隔，但是第⼆部分判断条件需要⽤&&链接，最终结果需要为真/假。
【嵌套循环特点】
外层循环控制⾏数，内层循环控制每⾏元素个数
[做图形题思路]（图形题请看案例三）
1、确定图形⼀共⼏⾏，即为外层的循环的次数；
2、确定每⾏有⼏种元素，代表有⼏个内层循环；
3、确定没种元素的个数，即为每个内层循环的次数；
Tips：通常，出每种元素个数，与⾏号的关系式，即为当前内层循环的最⼤值（从1开始循环）
例题如下：
案例⼀：
求和，实现 1+（1+2）+（1+2+3）+（1+2+3+4）+（1+2+3+4+5）=35
代码如下：
1var sum=0,sumRow=0;
2for (var i=1;i<=5;i++){
3 sumRow=0;
4
5if(i!=1) document.write("(");
6
7for (var j=1;j<=i;j++) {
8if (j!=i) document.write(j+"+");
9else document.write(j);
10 sumRow += j;
11 }
12if (i==1) document.write("+");
13else if(i==5) document.write(")=");
14else document.write(")+");
15
16 sum += sumRow;
17 }
18 document.write(sum);
案例⼆：
求和：实现1!+2!+3!+4!+5!
分析
1+
js当前日期加一天
1*2+
1*2*3+
1*2*3*4+
1*2*3*4*5=
代码如下：
1var sum=0;
2for (var i=1;i<=5;i++){
3var jie=1;
4for (var j=1;j<=i;j++){
5 jie *= j;
6 }
7 sum += jie;
8 }
9 document.write("1!+2!+3!+4!+5!="+sum);
案例三：（六⼤图形题）
1、矩形
代码如下：
1for(var i=1;i<=5;i++){
2for(var j=1;j<=5;j++){
3 document.write("*");
4 }
5 document.write("<br />");
6 }
7
8 document.write("<hr />");
实现效果：
2、直⾓三⾓形
代码如下：
1for(var i=1;i<=5;i++){
2for(var j=1;j<=i;j++){
3 document.write("*");
4 }
5 document.write("<br />");
6 }
7
8 document.write("<hr />");
实现效果：
3、平⾏四边形
代码如下：
1for(var i=1;i<=5;i++){
2for(var j=1;j<=i+4;j++){
3if(j<i)document.write(" "); 4else{document.write("*");}
5 }
6 document.write("<br />");
7 }
8
9 document.write("<hr />");
实现效果：
4、菱形
代码如下：
1for (var i=1;i<=4;i++){
2for(var j=1;j<=4-i;j++){
3 document.write(" ");
4 }
5for(var k=1;k<=2*i-1;k++){
6 document.write("*");
7 }
8 document.write("<br />");
9 }
10for (var i=1;i<=3;i++){
11for(var j=1;j<=i;j++){
12 document.write(" ");
13 }
14for(var k=1;k<=7-2*i;k++){
15 document.write("*");
16 }
17 document.write("<br />");
18 }
19
20 document.write("<hr />");
实现效果：
5、数字等边三⾓形
代码如下：
1for(var i=1;i<=4;i++){
2// 空格
3for(var k=1;k<=4-i;k++){
4 document.write("<span style='display: inline-block;width: 8px;'></span>");
5 }
6var n = 1;
7// 递增
8for(var j=1;j<=i;j++){
9 document.write(n);
10 n++;
11 }
12 n-=2;
13// 递减
14for(var m=1;m<=i-1;m++){
15 document.write(n);
16 n--;
17 }
18// 回车
19 document.write("<br/>");
20 }
21
22 document.write("<hr />");
实现效果：
6 、九九乘法表（以table表格的形式打印）
代码如下：
1 document.write("<table width='700'>")
2for(var i=1;i<=9;i++){
3 document.write("<tr>")
4for(var j=1;j<=i;j++){
5 document.write("<td>"+i+"*"+j+"="+i*j+"</td>");
6 }
7 document.write("</tr>")
8 }
9 document.write("</table>")
10
11
12
13 document.write("<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />")；实现效果：
案例四：
输⼊⼀个数字，然后判断是否为正整数，如果不是，提⽰重新输⼊；
如果是，将该数字左右反转，然后输出（例如：12345，翻转之后为54321）
代码如下：
1 var sum=1;
for(var i=1;i<=2;){
var num = prompt("请输⼊⼀个数字~");
if(Number(num)>0&&parseInt(num)==parseFloat(num)){
break;
}
}
/*
num = 12345
5 num%10;
4 num/10%10;
3 num/10/10%10;
…
…
*/
document.write("您输⼊的数字为："+num+"<br />");
for(j=1;;j++){
sum *= 10;
var fz = parseInt(num%sum/(sum/10));
document.write(fz);
if(num-sum<=0){
break;
}
}
实现效果：
案例五：
编写⼀个程序，最多接受10个数字，并求出其中所有正数的和。
⽤户可通过输⼊999终⽌程序，统计出⽤户输⼊的正数个数，并显⽰这些正数的和。分析：
①输⼊⾮数值，不占⽤10次机会之⼀，但要求重新输⼊；
②输⼊的是数值，只累加整数；
判断是否为⼀个数字：Number（num）不为NaN，说明为数字
判断⼀个数字为正数：Number(num)>0
判断⼀个数字为整数：parseInt(num)==parseFloat(num);
代码如下：
1var i=1,sum=0,n=0;
2while(i<=3){
3var num = prompt("请您输⼊⼀个数，我会为您计算出所有正数的和~");
发表评论