简说JS中的循环部分
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了简说JS中的循环部分相关的知识，希望对你有一定的参考价值。
JS中的循环语句是JS基础的最最重要的部分，没有之一，后面所学的其他的一些重要的知识也是需要在此的基础啥古玩城更高级的设置，先来简单的说一下循环的一些知识点。
一、循环结构的执行步骤
1、声明循环变量；
2、判断循环条件；
3、执行循环体操作；
4、更新循环变量；
然后，循环执行2-4，直到条件不成立时，跳出循环。
while循环()中的表达式，运算结果可以是各种类型。但是最终都会转为真假，转换规则同if结构。
while循环特点：先判断，再执行；
do-while循环特点：先执行，再判断；即使初始条件不成立，do-while循环也至少执行一次。
二、for循环
1、for循环有三个表达式：
①声明循环变量 ②判断循环条件 ③更新循环变量
三个表达式之间，用；分隔
for循环三个表达式都可以省略，但是两个；缺一不可
2、for循环的执行特点：先判断，再执行；与while相同
3、for循环三个表达式都可以由多部分组成，第二部分多个判断条件用&& ||链接，第一三部分用逗号分隔；
循环控制语句
① break：跳出本层循环，继续执行循环后面的语句。
如果循环有多层嵌套，则break只能跳出一层。
② continue：跳过本次循环剩余的代码，继续执行下一次代码。
a、对于for循环，continue之后执行的语句，是循环变量更新语句i++；
b、对于while、do-while循环，continue之后执行的语句，是循环条件判断；
因此，使用这两个循环时，必须将continue放到i++之后使用。否则continue将跳过i++，导致死循环。
三、if-else结构
1、结构写法：
if(判断条件){
条件为true时，执行if的{}
}else{
条件为false时，执行ease的{}
}
2、注意事项：
①else{}语句块可以根据情况省略；
②if和else后面的{}可以省略，但是省略{}后，if和else后面只能跟一条语句；(所以，不建议省略)；
3、【重点】if的{}中的判断条件支持的情况：
①Boolean：true为真，false为假；
②String：空字符串为假，所有非空字符串为真；
③Number：0为假，一切非零数字为真；
④undefined null NAN：全为假；
⑤Object：全为真；
四、多重if、阶梯if结构
1、结构写法：
if(条件一){
条件一成立，执行的操作
}else if(条件二){
条件一不成立&&条件二成立，执行的操作
}else if{
上述所有的条件都不成立，执行的操作
}
2、多重if结构中，各个判断条件是互斥的，执行选择其中一条路执行。遇到正确选项并执行完以后，直接跳出结构，不再判断后续分支。
五、嵌套if结构
1、结构写法：
if(条件一){
条件一成立
if(条件二){
条件一成立 && 条件二成立
}else{
条件一成立 && 条件二不成立
}
}else{
条件一不成立
}
2、在嵌套if结构中，如果省略{}，则else结构永远属于离他最近的一个if结构；
3、嵌套结构可以多层嵌套，但是一般不推荐超过3层。
能用多层if结构的一般不推荐使用嵌套if。
六、switch-case
1、结构写法
2、注意事项：
①switch结构()中的表达式，可以使用各种js支持的数据类型；
②switch机构在进行判断的时候，使用的===判断；
③case后面的表达式可以是各种数据类型，但是值要求各不相同，否则也只会执行第一个case；
④break作用：执行完case代码后，跳出当前switch结构；
缺少break后果：从第一个正确的case项开始，执行后面的所有case和default；原因：⑤↓
⑤switch结构在进行判断的时候，只会判断一次正确答案。当遇到正确的case之后，将不会再判断后续的项目。
⑥switch结构的执行效率要比多重if快。在多路分支结构中，推荐优先使用switch。
[循环嵌套的规律]：外层循环控制行数，内层循环控制每行中的个数
七、图形题做题思路
1、确定一共有几行。行数即为外层循环的次数
2、确定每行中有几种元素组成，有几种元素，即表示有几个内层循环
3、确定每种元素的个数，这个个数即为每个内层循环的次数
tips：如果每种元素个数不固定则，找出每种元素个数，与行号关系。这个关系表达式，即为内层循环的最大值
八、循环语句用的一些例子
1、猜数字的小游戏
<script type="text/javascript"> var ans=5; do{ var num=prompt("请输入你的猜测"); if(num>ans){ alert("您输入的数字偏大"); }else if(num<ans){ alert("您输入的数字偏小"); }else{ alert("猜对了！"); } }while(num!=ans); </script>
这仅仅是用JS做出来的，虽然看起来比较简陋，但是该有的功能都用循环语句实现了
2、倒序输出
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var num=parseInt(prompt("請輸入一個整數")) while(num>0){ var a=num%10; document.write(a); num=parseInt(num/10); } </script> </head> <body> </body> </html>
我们在一些网页见到的，把一些数字整个颠倒
3、求和
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var sum=0,count=0; for(var i=1;i<=10;i++){ var num=parseInt(prompt("請輸入一個數字")); if(num==999) break; if(num>0){ count++; sum+=num; } } document.write("您輸入了"+count+"個正數,"+"和為:"+sum); </script> </head> <body> </body> </html>
这个功能就是只要输入进去的数小于999就会让你一直输，直到你输入的数大于999才会停止循环，并且把你大于999之前输入的次数打印出来，并且把那些求和。
4、求位数
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var num=parseInt(prompt("请输入一个整数")); var w=0; do{ num=parseInt(num/10); w++; }while(num>0); document.write("该整数是"+w+"位数"); </script> </head> <body> </body> </html>
求出一个数是几位数，可以更加方便我们的计算
5、输入年月日，求该天是今年的第几天
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> // ① 拿到年月日 var year = parseInt(prompt("请输入 年份：")); var mon = parseInt(prompt("请输入 月份：")); var day = parseInt(prompt("请输入 日期：")); // ② 根据月份求出当前月，之前的所有月份的天数和； var days = 0; for(var i=1; i<mon; i++){ if(i==1||i==3||i==5||i==7||i==8||i==10||i==12){ days += 31; }else if(i==4||i==6||i==9||i==11){ days += 30; }else { // 2月份多少天，需要判断是否是闰年 if(year%4==0&&year%100!=0 || year%400==0){ days += 29; }else{ days += 28; } } } days += day; // 将当前月份的天数，加上 document.write("这是今年的第"+days+"天"); </script> </head> <body> </body> </html>
感觉这个还是挺实用，但是好像一般并不需要计算是改年的第几天。还有用switch-case来做的
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> // ① 拿到年月日 var year = parseInt(prompt("请输入 年份：")); var mon = parseInt(prompt("请输入 月份：")); var day = parseInt(prompt("请输入 日期：")); var days = 0; // ② 根据月份求出当前月，之前的所有月份的天数和； switch (mon-1){ case 11: days += 30; case 10: days += 31; case 9: days += 30; case 8: days += 31; case 7: days += 31; case 6: days += 30; case 5: days += 31; case 4: days += 30; case 3: days += 31; case 2: if(year%4==0&&year%100!=0 || year%400==0) days += 29; else days += 28; case 1: days += 31; case 0: days += 0; } days += day; // 将当前月份的天数，加上 document.write("这是今年的第"+days+"天"); </script> </head> <body> </body> </html>
6、求水仙花数
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var a,b,c; for(var i=100;i<1000;i++){ a=i%10; b=parseInt(i/10)%10; c=parseInt(i/100); if(a*a*a+b*b*b+c*c*c===i){ document.write(i+" "); } } </script> </head> <body> </body> </html>
在学C语言的时候就接触到的水仙花数，现在可以直接用JS代码来直接求出
7、斐波那契数列
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var a=1,b=1,c; document.write("1 1 ") for(var i=3;i<=18;i++){ c=a+b; document.write(c+" "); if(i%5==0) document.write("<br />") a=b; b=c; } </script> </head> <body> </body> </html>
斐波那契数列（Fibonacci sequence），又称黄金分割数列、因数学家列昂纳多·斐波那契（Leonardoda Fibonacci）以兔子繁殖为例子而引入，故又称为“兔子数列”，指的是这样一个数列：1、1、2、3、5、8、13、21、34、……在数学上，斐波纳契数列以如下被以递归的方法定义：F(0)=0，F(1)=1, F(n)=F(n-1)+F(n-2)（n>=2，n∈N*）
九、关于循环语句的一些感想
51的循环语句学的并不是很好，可以说是看见循环语句就有些头疼，但是51还是选择把他整理出来了。本来就不好，怎么就可以这样放下呢，如果紧急这样就放弃了，那51还学这些干嘛，还有更难得困难在后面，51得好好加油才行。
以上是关于简说JS中的循环部分的主要内容，如果未能解决你的问题，请参考以下文章