🌈个人主页:前端青山
🔥系列专栏:JavaScript篇
🔖人终将被年少不可得之物困其一生
依旧青山,本期给大家带来JavaScript篇专栏内容:JavaScript-for循环
目录
循环结构
循环思想(三要素)
实现循环的语句
当型循环
直到型循环
多功能循环
案例
输出10个HelloWorld
输出1~100的奇数
输出m~n的整数
i. 求5!(阶乘:从1 乘到它本身)
解决猴子吃桃的问题(有一只猴子,还有一堆桃子,第一天的时候,吃了一堆桃子中的一半,没忍住,又多吃了一个;第二天的时候,又吃了剩下桃子中的一半,没忍住,又多吃了一个,以后每天如此,直到第10天的时候,只剩下了一个桃子,问第一天的时候有多少个桃子)
求1+2+3+……+100的和
输出1-100中(7的倍数和带7的数除外)的数。
输出m至n的自然数中的偶数和与奇数和并统计偶数与奇数的个数分别是多少?
入职薪水10K,每年涨幅5%,50年后工资多少?
流程控制关键字
循环的区别
while:
do while:
for
循环结构
循环结构 : 满足一定条件,重复执行一个动作或一段代码。
循环思想(三要素)
-
从哪里开始
-
到哪里结束
-
步长(步进)
实现循环的语句
-
while
-
do while
-
for
当型循环
循环初值;
while(循环条件){语句组;步长;
}
直到型循环
循环初值;
do{语句组;步长;
}while(循环条件);
多功能循环
for(循环初值;循环条件;步长){语句组;
}
案例
-
输出10个HelloWorld
<script>输出10个HelloWorld输出: alert() document.write() console.log()10个:重复 循环 三要素:i = 1; i < 11 i ++循环语法:whiledo whilefor//while//循环初值var i = 1;while(i < 11){console.log('HelloWorld');i ++;// i += 2;}//do whilevar j = 1;do{console.log('HelloWorld');j ++;}while(j < 11);//forfor(var k = 1;k < 11;k ++){console.log('HelloWorld');}</script>
-
输出1~100的奇数
<script>输出1~100的奇数输出: alert() document.write() console.log()1~100 : 重复 循环 三要素: i = 1 i < 101 i ++ (i += 2)奇数: 不能被2整除 一个条件 一个结果 单分支 if(){}whilevar i = 1;//准备一个变量,存放结果var str = '';while(i < 101){if(i % 2){// document.write(i + ' '); //满足一次条件,就和页面交互一次//优化后的语句str += i + ' '; //'' + 1 str = '1' + 3}i ++;}将str 一次性添加到页面中document.write(str);console.log(str);alert(str);var i = 1,str = '';do{str += i + ' ';i += 2;}while(i < 101);document.write(str);var i = 1,str = '';do{if(i % 2){str += i + ' ';}i ++;}while(i < 101);document.write(str);document.write('<br>');for(var i = 1,str = '';i < 101;i += 2){str += i + ',';}document.write(str);</script>
-
输出m~n的整数
<script>输出m~n的整数输出m~n prompt() parseInt()if(m < n){如果m = 1,n = 5 重复-循环-三要素 i = m; i <= n;i ++}else{如果m = 5,n = 1 重复-循环-三要素 i = m; i >= n;i --}//1. 准备两个变量var m = parseInt(prompt('请输入一个整数:'));var n = parseInt(prompt('请输入一个整数:'));//2. 判断谁大谁小if(m < n){for(var i = m,str = '';i <= n;i ++){str += i + ' ';}//输出结果document.write(str);}else{for(var i = m,str = '';i >= n;i --){str += i + ' ';}//输出结果document.write(str);}</script>
-
i. 求5!(阶乘:从1 乘到它本身)
<script>
求5!(阶乘:从1 乘到它本身) 1 * 2 * 3 * 4 * 5
1. 重复乘法的操作,所以使用循环 三要素 : i = 1 i < 6 i ++for(var i = 1,fac = 1;i < 6;i ++){fac *= i; //fac = 1 * 1 * 2 * 3 * 4 * 5}alert(fac);</script>
-
解决猴子吃桃的问题(有一只猴子,还有一堆桃子,第一天的时候,吃了一堆桃子中的一半,没忍住,又多吃了一个;第二天的时候,又吃了剩下桃子中的一半,没忍住,又多吃了一个,以后每天如此,直到第10天的时候,只剩下了一个桃子,问第一天的时候有多少个桃子)
<script>解决猴子吃桃的问题(有一只猴子,还有一堆桃子,第一天的时候,吃了一堆桃子中的一半,没忍住,又多吃了一个;第二天的时候,又吃了剩下桃子中的一半,没忍住,又多吃了一个,以后每天如此,直到第10天的时候,只剩下了一个桃子,问第一天的时候有多少个桃子)1. 第10天: 1 sum = 12. 每天是怎么吃的? 第9天: (sum + 1) * 2 43. 8 (4 + 1) * 2 107 6 5 4 3 2 1 天重复天数, 循环 i = 9 i > 0 i --for(var day = 9,sum = 1;day > 0;day --){sum = (sum + 1) * 2}alert(sum);</script>
-
求1+2+3+……+100的和
<script>求1+2+3+……+100的和重复 + 循环 三要素 i = 1 i < 101 i ++for(var i = 1,sum = 0;i < 5;i ++){sum += i;}alert(sum);</script>
-
输出1-100中(7的倍数和带7的数除外)的数。
<script>输出1-100中(7的倍数和带7的数除外)的数。1-100 : 循环 i = 1; i < 101 i ++7的倍数和带7的数除外:!(i % 7 === 0 || parseInt(i / 10) === 7 || i % 10 === 7)i % 7 && parseInt(i / 10) !== 7 && i % 10 !== 7//result : 结果for(var i = 1,result = '';i < 101;i ++){if(!(i % 7 === 0 || parseInt(i / 10) === 7 || i % 10 === 7)){result += i + ' ';}}document.write(result);</script>
-
输出m至n的自然数中的偶数和与奇数和并统计偶数与奇数的个数分别是多少?
<script>输出m至n的自然数中的偶数和与奇数和并统计偶数与奇数的个数分别是多少?1. m 至 n 用户输入两个数2. 确保 m < nif(m > n){交换两个值}3. 实现循环三要素: i = m; i <= n; i ++4. 是否能被2整除 奇数 偶数 双分支偶数和奇数和偶数的数量奇数的数量//1. 准备两个变量var m = parseInt(prompt('请输入一个整数:'));var n = parseInt(prompt('请输入一个整数:'));//1.1 准备放置结果的变量// even : 偶数// sum : 和// odd : 奇数//count: 统计var even_sum = 0;var odd_sum = 0;var even_count = 0;var odd_count = 0;//2. 确保m < nif(m > n){var t = m;m = n;n = t;}//3. 实现循环for(var i = m;i <= n;i ++){//4. 判断奇偶if(i % 2){//true : 奇数odd_sum += i;odd_count ++;}else{//false : 偶数even_sum += i;even_count ++;}}//5. 输出结果console.log('偶数和:' + even_sum + '\n奇数和:' + odd_sum + '\n偶数数量:' + even_count + '\n奇数数量:' + odd_count);</script>
-
入职薪水10K,每年涨幅5%,50年后工资多少?
<script>入职薪水10K,每年涨幅5%,50年后工资多少?初值: sum = 10i = 2 i < 51 i ++sum = sum + sum * 0.05 sum += sum * 0.05for(var sum = 10,i = 2;i < 51;i ++){sum += sum * 0.05;}alert(sum);</script>
流程控制关键字
-
continue : 跳出本次循环,直接进入一下次循环。
-
break : 跳出循环。
<script>for(var i = 1;i < 6;i ++){// if(i == 2 || i == 4){// continue; //当i = 2 或 i = 4 的时候,直接跑到下一次循环// }if(i !== 2 && i !== 4){//console.log() : 每输出一次,自动换一行console.log(i); // 1 3 5}}//break : 退出循环for(var i = 1;i < 6;i ++){if(i === 3){break;} }//上面的循环结束后,才能执行到下面的语句,那么 什么时候结束的?3console.log(i); //3</script>
循环的区别
while:
- 1. 当型循环,先判断条件,后执行语句
- 2. 当条件第一次为假时,一次也不执行。
- 3. 常用于循环次数不确定时
do while:
- 1. 直到型循环,先执行语句,后判断条件
- 2. 当 条件第一次为假时,至少执行一次循环
- 3. 常用于循环次数不确定时
for
- 1. 多功能循环(当型循环),先判断条件,后执行语句
- 2. 当条件第一次为假时,一次也不执行
- 3. 常用于循环次数确定时