重复重复(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>
输出:成绩:70及格,继续循环 成绩:80及格,继续循环 成绩:66及格,继续循环 成绩:90及格,继续循环 成绩50不及格,不用循环了</html>
继续循环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>
输出:成绩:70及格,输出! 成绩:80及格,输出! 成绩:66及格,输出! 成绩:90及格,输出! 成绩不及格,不输出! 成绩:100及格,输出! 成绩:89及格,输出!</html>
编程练习
在一个大学的编程选修课班里,我们得到了一组参加该班级的学生数据,分别是姓名、性别、年龄和年级,接下来呢,我们要利用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>
输出:0,3,5,8 小A小D小I</html>