学习JS的第三天
一、循环概念
循环三要素:
1、循环起点
2、循环的结束条件
3、变量更新(便于跳出循环,是趋于循环结束条件)
二、while循环
语法结构 :while(循环判断条件){ 执行的代码};
//例如 打印1-10的数字
var i = 1; //变量初始化 ,循环起点。
while(i<=10){ //循环判定条件,
console.log(i); //控制台打印i
i++; //变量更新
}
注意点:
1、在循环开始前,必须对变量初始化(声明变量,给变量给个初始值)
2、如果while的条件为true,则会重复不断的执行循环体中的代码,如果条件为false,则退出循环。
3、在循环体中,必须有“变量更新”的语句。换句话说,两次循环的变量值不能一样,如果一样,会造成死循环。
三、死循环
死循环指,循环结构因缺乏循环结束条件,而陷入无限循环的状态。
// 缺少变量更新
var i = 1;
while(i<=10){
console.log(i);
}
//判定条件一直为真
var i = 0;
while(true){
console.log(i);
i++;
}
四、do while 循环(先斩后奏)
语法:do{ 执行代码 }while();
// 例如 打印 1- 10 的数字
var i = 0 ; //变量初始化 ,循环起点。
do{
console.log(i); //循环体
i++;
}while(i<=10); //循环判定条件,也称结束条件
区别:do while与while 循环大体上是相同的,主要的区别是无论判定条件是否满足都将先执行一次!
五、双层嵌套循环
双层循环分为外循环和内循环,外循环执行一次,内循环执行一轮!
//打印 一个 三行三列的表格
var str="<table>";
var i = 0;
while(i<3){ // 外层控制行数,
str +="<tr>";
var j = 0;
while(j<3){ //内层控制列数
str += "<td></td>";
j++;
}
str += "</tr>";
i++;
}
str +="</table>";
document.write(str);
//打印 99乘法表
var str = '<table>';
var i = 1;
while(i<=9){
str += '<tr>';
var j=1;
// 第一轮 i = 1 j=1 <= i(i=1) 执行str j++ j=2<i=1不满足跳出 i++ 进入下一轮
// 第二轮 i = 2 j=1 <= i(i=2) 执行str j++ j=2<=i 满足 执行str j++ j=3 不满足条件开始 i++ 开始下一轮
// 第三轮 i = 3 j=1 <= i(i=3) 执行str j++ ... j++ j=4 j>i 跳出循环 i++ 开始下一轮
//...
// 第9轮 i = 9 j=1 <= i(i=3) 执行str ... j++ j=10 j>i 跳出循环 i++ i>9 循环结束
while(j<=i){
str+= '<td>'+j+'×'+i+'='+j*i+'</td>';
j++;
}
str += '</tr>';
i++;
}
str += '</table>';
ocument.write(str);
五、for 循环
语法规则:for(变量初始化;判断条件;变量更新 ){ 执行代码}
span{
border: 1px solid red;
display: inline-block;
width: 120px;
height: 30px;
text-align: center;
margin: 10px;
line-height: 30px;
}
//打印 9*9乘法表
var str = '';
for(var i=1 ; i<=9 ; i++ ){
for(var j=1 ; j<=i ; j++){
str +='<span>'+j+'×'+i+'='+j*i+'</span>';
}
str += '<br/>';
}
document.write(str);
//打印 金字塔a
var len =
for(var i=0;i< ){
}
/*
1111*
111**
11***
1****
***** 要求出空格数 = 5 - i
空格数量 = 总行数 - 每一行星星的个数 1=
*/
//外层循环控制的是行
// 1<=5
// 2<=5
for(var i=1; i<=5; i++){
//内层循环控制的是列
// 1<=1 第一次的时候输出一颗星星
// 2<=1 条件不满足,直接结束循环
// 1<=2
// 2<=2 第二次的时候输出两颗星星
// 3<=2 条件不满足,直接结束循环
//...
for(var j=1; j<=i; j++){
document.write('●');
}
document.write('<br/>');
}
document.write('<hr/>');
//任意打印多少行
var len = prompt("请输入数字");
for (var i = 0 ; i<=len ; i++ )
{
for(var j = 0 ; j<i-1 ; j++){
document.write("a");
}
document.write('<br/>');
}
//任意打印多少行金字塔
var len = prompt("请输入数字");
for (var i = 0 ; i<=len ; i++ )
{
for (var k =0 ; k<len-i ; k++) {
document.write(' ');
}
for(var j = 0 ; j<i ; j++){
document.write("a");
}
document.write('<br/>');
}
六、break与continue
break语句:
描述:
-
break语句,用于无条件结束各种循环和switch。
-
说明:一般情况下,需要在break语句之前加一个条件判断。换句话说:就是条件成立了,就退出循环。
-
break只能跳出单层循环,不能一次跳出多重循环。
for(var i=1; i<=100; i++) { //超过50的不再要 if(i==50) { break; //跳出循环,跳到for的大括号之后了。break之后的所以语句终止执行 //break只能跳出单层循环,不能一次跳出多重循环 } document.write(i+" "); }
实现效果: 1 2 3 4. . . 49 //在 i= 50时结束循环
continue语句:
描述:结束本次循环,而开始下次循环。
说明:一般情况下,需要在continue语句之前加一个条件判断。
for(var i=1; i<=100; i++)
{
//超过50的不再要
if(i==50)
{
continue; //跳过当前次循环,执行下一次
//continue 不结束循环,
}
document.write(i+" ");
}
实现效果: 1 2 3 4. . . 49 51 52 53....100 //只跳过50这次
七、循环区别
while :
1、在循环次数不确定的时候使用。
2、while的效率相对for循环更低。
3、在不知道循环次数情况下,适用的场景更多。
do while:
1、无论判定条件是否满足都将先执行一次!
for 循环:
1、for循环效率更加高相较于while循环
2、语法相较于更加严谨
3、for循环对循环次数要求更加明确