js流程控制语句（循环）

最新推荐文章于 2021-09-10 13:50:58 发布

_米粒儿_

最新推荐文章于 2021-09-10 13:50:58 发布

阅读量645

点赞数

分类专栏： Javascript 文章标签：流程控制 javascript 循环

本文链接：https://blog.csdn.net/yiren_99/article/details/47839703

版权

Javascript 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

重复重复（for循环）

很多事情不只是做一次，要重复做。如打印10份试卷，每次打印一份，重复这个动作，直到打印完成。这些事情，我们使用循环语句来完成，循环语句，就是重复执行一段代码。

for语句结构：
for(初始化变量;循环条件;循环迭代)
{     
    循环语句 
 }
例子：我们有每一个篮子1，2，3...10不同数量的球，使用for语句完成合计，看看我们一共有多少钱？
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>if...else</title>
<script type="text/JavaScript">
var ball,sum=0;//ball变量存放不同面值，sum总计
for(ball=1;ball<=10;ball++)
{ 
  sum= sum + ball;
}
  document.write("sum合计:"+sum);
</script>
</head>
<body>
</body>
</html>
输出：sum合计：55

反反复复(while循环)

和for循环有相同功能的还有while循环, while循环重复执行一段代码，直到某个条件不再满足。

while语句结构：
while(判断条件)
{
    循环语句
 }
例子：我们使用while语句，输出5个数字
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>while</title>
<script type="text/javascript">
  var mynum =1;//mynum初值化数值为1
   while(mynum<=5)
  {
	document.write("数字:"+mynum);
    mynum=mynum+1;	
   }
</script>
</head>
<body>
</body>
</html>
输出：数字:1数字:2数字:3数字:4数字:5

来来回回(Do...while循环)

do while结构的基本原理和while结构是基本相同的，但是它保证循环体至少被执行一次。因为它是先执行代码，后判断条件，如果条件为真，继续循环。

do...while语句结构：
do
{
    循环语句
 }
while(判断条件)
例如：我们使用do...while语句，输出6个数字。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>do...while</title>
<script type="text/javascript">
    var mynum =6;//mynum初值化数值为6
	do
	{
	document.write("数字:"+mynum+"<br/>");
	mynum=mynum-1;
	}
	while( mynum>0)
	</script>
</head>
<body>
</body>
</html>
输出：

数字:6

数字:5

数字:4

数字:3

数字:2

数字:1

退出循环break

在while、for、do...while、while循环中使用break语句退出当前循环，直接执行后面的代码。

格式如下：
for(初始条件;判断条件;循环后条件值更新)
{
  if(特殊情况)
  {break;}
  循环代码
}
例子：考试成绩输出，如果成绩及格继续输出下个成绩，如果成绩不及格，退出并且后面成绩不输出，我们使用break语句，退出循环。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>break</title>
<script type="text/JavaScript">
var mynum =new Array(70,80,66,90,50,100,89);//定义数组mynum并赋值
var i=0;
while(i<mynum.length)
{
  if(mynum[i]<60)
   {
    document.write("成绩"+mynum[i]+"不及格，不用循环了"+"<br>");
    break;
   }
  document.write("成绩:"+mynum[i]+"及格，继续循环"+"<br>");
  i=i+1;
  
}
</script>
</head>
<body>
</body>
</html>
输出：成绩:70及格，继续循环成绩:80及格，继续循环成绩:66及格，继续循环成绩:90及格，继续循环成绩50不及格，不用循环了

继续循环continue

continue的作用是仅仅跳过本次循环，而整个循环体继续执行。

语句结构：
for(初始条件;判断条件;循环后条件值更新)
{
  if(特殊情况)
  { continue; }
 循环代码
}
上面的循环中，当特殊情况发生的时候，本次循环将被跳过，而后续的循环则不会受到影响。

例如：考试成绩输出，如果成绩及格继续输出下个成绩，如果成绩不及格，则不输出该成绩，我们使用continue语句完成
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>continue</title>
<script type="text/JavaScript">
 var mynum =new Array(70,80,66,90,50,100,89);//定义数组mynum并赋值
 var i;
 for(i=0;i<mynum.length;i++)
 {
  	if(mynum[i]<60)
    {
	document.write("成绩不及格，不输出！"+"<br>");
    continue;
	}
	document.write("成绩:"+mynum[i]+"及格，输出!"+"<br>");
}
</script>
</head>
<body>
</body>
</html>
输出：成绩:70及格，输出! 成绩:80及格，输出! 成绩:66及格，输出! 成绩:90及格，输出! 成绩不及格，不输出！成绩:100及格，输出! 成绩:89及格，输出!

编程练习

在一个大学的编程选修课班里，我们得到了一组参加该班级的学生数据，分别是姓名、性别、年龄和年级，接下来呢，我们要利用JavaScript的知识挑出其中所有是大一的女生的的名字哦。

学生信息如下：

    ('小A','女',21,'大一'), ('小B','男',23,'大三'),

    ('小C','男',24,'大四'),  ('小D','女',21,'大一'),

    ('小E','女',22,'大四'), ('小F','男',21,'大一'),

    ('小G','女',22,'大二'), ('小H','女',20,'大三'),

    ('小I','女',20,'大一'), ('小J','男',20,'大三')
<!DOCTYPE  HTML>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>流程控制语句</title>
<script type="text/javascript">
 //第一步把之前的数据写成一个数组的形式,定义变量为 infos
 var infos = [];
 infos[0] = ['小A','女',21,'大一'],
 infos[1] = ['小B','男',23,'大三'],
 infos[2] = ['小C','男',24,'大四'],  
 infos[3] = ['小D','女',21,'大一'],
 infos[4] = ['小E','女',22,'大四'],
 infos[5] = ['小F','男',21,'大一'],
 infos[6] = ['小G','女',22,'大二'],
 infos[7] = ['小H','女',20,'大三'],
 infos[8] = ['小I','女',20,'大一'],
 infos[9] = ['小J','男',20,'大三'];
 
 var oneInfo = [];
 //第一次筛选，找出都是大一的信息
 for(var i=0; i<9; i++) {
    if(infos[i][3] === '大一') {
        oneInfo.push(i);
    }    
 }
 document.write(oneInfo+"</br>");
 //第二次筛选，找出都是女生的信息
 for(var j=0; j<oneInfo.length; j++){
     if(infos[oneInfo[j]][1] === '女') {
         document.write(infos[oneInfo[j]][0]);
     }
 }
</script>
</head>
<body>
</body>
</html>
输出：0,3,5,8 小A小D小I

_米粒儿_

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js流程控制语句（循环）

重复重复（for循环）很多事情不只是做一次，要重复做。如打印10份试卷，每次打印一份，重复这个动作，直到打印完成。这些事情，我们使用循环语句来完成，循环语句，就是重复执行一段代码。for语句结构：for(初始化变量;循环条件;循环迭代){ 循环语句 }例子：我们有每一个篮子1，2，3...10不同数量的球，使用for语句完成合计，看看我们一共有多
复制链接

扫一扫