js循环(while循环,do while循环,for循环)相关知识点及练习

Posted ljp1997

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js循环(while循环,do while循环,for循环)相关知识点及练习相关的知识,希望对你有一定的参考价值。

08.循环

1.循环!

循环的作用:

  1. 简化代码,处理重复执行的代码

  2. 遍历数组、json对象、节点集合

2.while循环

语法:

while(循环的条件)

循环体

3.循环的五大要素

  1. 循环变量

  2. 循环变量的初始化

  3. 循环的增值

  4. 循环的终止条件

  5. 循环体

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("输入错误...");

01.do while

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 + "&nbsp;&nbsp;&nbsp;&nbsp;");
 
   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 + "&nbsp;&nbsp;&nbsp;");
       //每打印一个闰年,计数器加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>" + "&nbsp;");
     
   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-block;
       margin:10px;
 
</style>
<script>
   //行数
   for(var i = 1 ; i <= 5 ; i++)
       //空的用每一个span把它挤过去
       for(var j = 4 ; j >= i ; j--)
           document.write("<span></span>" + "&nbsp;");
     
       //等腰三角形的显示
       for(var k = 1 ; k <= i ; k++)
           document.write("<div></div>" + "&nbsp;");
     
   document.write("<br>");

</script>
5.求100-900之间的水仙花数。abc =a*a*a + b*b*b +c*c*c(次方函数: Math.pow(x,y);  x的y次方)
分析:获取 个位、十位、百位 上面的数字
369数   取出 3 6 9;
取9 369 % 10;
取6 parseInt(369 / 10) % 10;
取3 parseInt(369 / 100);
拓展:
Math.round();   四舍五入
   Math.random();   随机数
   Math.pow();     多少平方
   Math.ceil();    向上取整
   Math.floor();   向下取整
for(var i = 100 ; i < 900 ; i++)
   var
  ge = (i % 10),
       shi = (i / 10) % 10,
       bai = (i / 100);
   if(i == Math.pow(ge,3) + Math.pow(shi,3) + Math.pow(bai,3))
       console.log(i + "是水仙花数");
 

6.求出1-1/2+1/3-1/4+1/5....1/100的结果
for(var i = 1 ; i <= 100 ; i++)
   if(i % 2 == 0)
       sum -= 1 / i;
 
   if(i % 2 != 0)
       sum += 1/i;
 

document.write(sum);
7.菱形:
//行数
for(var i = 1 ; i <= 5 ; i++)
   for(var k = 4 ; k >= 1 ; k--)
       document.write("<span></span>");
 
   for(var j = 1 ; j <= 2 * i - 1 ; j++ )
       document.write("<div></div>");
 
   document.write("<br>");

for(var i = 4 ; i >= 1 ; i--)
   for(var k = 4 ; k >= i ; k--)
       document.write("<span></span>");
 
   for(var j = 1 ; j <= 2 * i - 1 ; j++)
       document.write("<div></div>");
 
   document.write("<br>");

05.跳出循环

break continue 执行逻辑:

break:直接跳出结束循环,后面的代码不再执行

continue:跳出当前本次循环,后面的代码继续执行

举例:

1:操场上跑步,预计跑10圈,当跑到6圈 —> 女朋友打电话 -> 停止! break

eg:
for(var i =  1 ; i <= 10 ; i++)
   if(i == 6)
       break;
 
   console.log(i);

?
eg:
for(var i = 1 ; i <= 10 ;i++)
   for(var k = 1 ; k <= 10 ; k++)
       if(k == 5)
           break;
     
       document.write(i + "a");
 
   document.write("<br>");

2:斗地主: 3个人 第二个人 炸弹 第三个人出不去,过! 第一个人王炸! continue

eg:输出1-50 里面不包括33的数字
for(var i = 1 ; i <= 50 ; i++)
   if(i == 33)
       continue;
 
   console.log(i);

任务(相关练习)

1.计算 1+2+3+4+5+...+23+25+...+50  //没有24
var sum = 0;
for(var i = 1 ; i <= 50 ; i++)
   if(i == 24)
       continue;
 
   sum += i;

document.write(sum);
2.计算100以内不能被6整除的数的和 (用continue完成)
var sum = 0;
for(var i = 1 ; i <= 100 ; i++)
   if(i % 6 == 0)
       continue;
 
   sum += i;

document.write(sum);
3.求1+2!+3!+...+20!的值
var sum = 0 ;
var product = 1;
for(var i = 1 ; i <= 20 ; i++)
   product *= i;
   sum += product;

console.write(sum);
4.篮球从5米高的地方掉下来,每次弹起的高度是原来的30%,经过几次弹起,篮球的高度小于0.1米。   //4次
什么情况下while和for:
  如果当循环次数 不确定的情况下 用while(true);  利用break;
var h = 5;
var count = 0;
while(true)
   h *= 0.3;
   count++;
   if(h < 0.1)
       break;
 

document.write(count);
5.有一个棋盘,有64个方格,在第一个方格里面放1粒芝麻重量是0.00001kg,第二个里面放2粒,第三个里面放4,第四个盘子放6个   棋盘上放的所有芝麻的重量
分析:(找规律)
第一种情况:第四个盘子放6个
   让从0算起:
   第几个盘子 几粒芝麻
  0 1   if(i == 0)num = 1;
1 2
2 4
3 6
var sum = 0;
var all = 0;
for(var i = 0 ; i < 64 ; i++)
   if(i == 0)
       sum = 1;
 
   else
       sum = 2 *i;
 
   all += sum;

console.log(all * 0.00001);
?
第二种情况:第四个盘子放8个
   让从0算起:
   第几个盘子 几粒芝麻
  0 1
1 2
2 4
3 8
var all = 0;
for(i = 0 ; i < 64 ; i++)
   if(i == 0)
       all = 1;
 
   all += Math.pow(2,i);

document.write(all * 0.00001);
6.输出100-200之间所有的素数(质数);
分析:素数(质数):除了1和它本身,不能被其它数整除的
for(var i = 100 ; i < 200 ; i++)
var flag = true;  //制定口令
   for(var j = 2 ; j < i ; j++)
       if(i % j == 0)
           flag = false;   //如果不设置口令,它每次只是除了2,对2进行了判断
           break;
     
 
   if(flag) //如果口令符合则执行
       //允许打印了
       console.log(i + "是素数");
 

 

以上是关于js循环(while循环,do while循环,for循环)相关知识点及练习的主要内容,如果未能解决你的问题,请参考以下文章

js循环语句while,do..while,for

js循环(while循环,do while循环,for循环)相关知识点及练习

如何在大小未知时使用 while..do 循环初始化 F# 列表

JS 循环 while for do while

js循环 if+switch break判断,while +do while循环

C++中do while()的用法