循环是程序路径的一个回路,可以让一部分代码重复执行。
循环的目的,指定代码块执行的次数,并且让每次的值不一样。
循环作用:可以计算,可以输出重复值
for循环
for循环,必备条件:变量初始化,变量的循环条件,和变量的更新
以分号;隔开
for循环原理
for循环是循环一次,输出一个值,而不是循环一次,就输出所有值
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var a=[10,20,34,56];
for(var i=0;i<a.length;i++){
console.log(i,a[i]);
}
</script>
</body>
</html>
for循环值
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var a=[1,2,34,56];
for(var i=0;i<a.length;i++){
console.log(a[i]);
}
</script>
</body>
</html>
for循环下标
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var a=[1,2,34,56];
for(var i=0;i<a.length;i++){
console.log(i);
}
</script>
</body>
</html>
练习:计算1-100之间所有整数和
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var sum=0;//sum代表整数和
for(var i=1;i<=100;i++){
sum+=i;//i表示每次更新的整数,sum表示每次更新后的总和
}
console.log(sum);
</script>
</body>
</html>
for循环还可以取出数组的i值和下标值,不止一个数组
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var dr=[1,2,3,4];
var dt=[110,4,-1,6];
var dy=[];
// 两数组值相加变成一个新数组
for(var i=0;i<dr.length;i++){
console.log(dr[i],i,"dr");
console.log(dt[i],i,"dt");
}
</script>
</body>
</html>
for循环双层嵌套
两个for循环嵌套形成的循环嵌套,通常都是第一个循环走一个值,第二个循环里的值都走完,不断重复这个过程,直到第一个循环的值都走完就结束了。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var a=[1,3,4,6];
var b=["*","#","&"];
for(var i=0;i<a.length;i++){
console.log(a[i])
for(var j=0;j<b.length;j++){
console.log(b[j])
}
}
</script>
</body>
</html>
练习:写3行3列的*
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
for(var i=0;i<3;i++){
document.write('*')
for(var j=0;j<2;j++){
document.write('*')
}
document.write("<br/>");
}
</script>
</body>
</html>
练习:写3行然后三行对应1列2列3列
这里的精髓在于j<i ,j值会随着每次的循环值进行改变,i值也会随着每次的循环,值进行改变,j值值都是动态变化的
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
for(var i=0;i<3;i++){
document.write('*')
for(var j=0;j<i;j++){
document.write('*')
}
document.write("<br/>");
}
</script>
</body>
</html>
练习:写5行然后倒着
我跟这个杠上了,还有右边一排和正三角形请好好想一想
这样为什么能做出来,没错,我也没想明白,属于瞎猫撞上死耗子了。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
for(var i=0;i<5;i++){
document.write('*')
for(var j=4;j>i;j--){
document.write('*')
}
document.write('<br/>')
}
</script>
</body>
</html>
for循环循环值问题
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var a=[1,2,3,4,5,6,7];
var b=null;
for(let i=0;i<a.length;i++){
console.log(a[i]);
//b组只有一个值,还是a组的最后一个值,我想要的是b组有a组的全部值
b=a[i]
}
console.log(b,"b组值");
</script>
</body>
</html>
练习:输出1000-9999之间的值,并且五个值为一行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var a=0;
for(var i=1000;i<=9999;i++){
if(i % 4 == 0 && i % 100 !== 0 || i % 400 == 0 ){
document.write(i+" ");
a++;
if(a%5==0){
document.write('<br/>')
}
}
}
</script>
</body>
</html>
循环嵌套
在循环体中又嵌套了另外一个循环,任意循环之间都可以相互嵌套
练习一:打印九九乘法表
自己的
// 打印九九乘法表
//1*1=1
var amass='';//打印最后的效果
var y;
// var s=1;//代表第二位数
for(var i=1;i<=9;i++){
for(var s=1;s<=i;s++){
y=i*s;
amass+=i+'*'+s+'='+y+' ';
}
}
console.log(amass);
老师的
//外层循环:控制循环的行数
for(var i=1;i<=9;i++){
//i代表行数
//1
//2
//3
//内层循环:控制每一行循环的列数
//循环条件是由当前行数决定
//准备一个变量保存空字符串,用于拼接每一列
for(var j=1,str='';j<=i;j++){
//拼接每一列
str+=j+'*'+i+'='+(i*j)+' ';
}
//内层循环结束代表每一行拼接结束
console.log(str);
}
尝试改进1
var y;
for(var i=1;i<=9;i++){
for(var s=1,amass='';s<=i;s++){
y=i*s;
amass+=i+'*'+s+'='+y+' ';
}
}
console.log(amass);
尝试改进2
var y;
// var s=1;//代表第二位数
for(var i=1;i<=9;i++){
for(var s=1,amass='';s<=i;s++){
y=i*s;
amass+=i+'*'+s+'='+y+' ';
}
console.log(amass);
}
注:我个人并不能理解,为什么console.log的位置变了,效果就完全不一样
var amass="amass的值之所以为‘’是因为变量只声明的话值会是undefined,如果赋值1,则会每行多1
var y;
// var s=1;//代表第二位数
for(var i=1;i<=9;i++){
for(var s=1,amass='1';s<=i;s++){
y=i*s;
amass+=i+'*'+s+'='+y+' ';
}
console.log(amass);
}
情况的不同,造成amass=1的结果也不同
var y;
amass=1;
for(var i=1;i<=9;i++){
for(var s=1;s<=i;s++){
y=i*s;
amass+=i+'*'+s+'='+y+' ';
}
}
console.log(amass);
循坏要素:循环条件 循环体
while循环
while(循环条件){
循环体;
}
for in 数组对象遍历,但无法遍历索引数组。也就是它的遍历会超出当前对象,继续遍历原型对象中的成员。
arr.forEach 数组家函数,只能数组家的对象使用,其他的类数组对象,无法使用。
for of
遍历数字下标的东西都可以用它(索引数组,类数组对象)
for(var 元素值 of 数组/类数组对象){
//of依次获取每个元素得值,无法获取每个元素的下标位置
}
eg: <script>
//定义一个函数,计算任意多个数值得和
//for
function add(){
var result=0;
for(var i=0;i<arguments.length;i++){
result+=arguments[i];
}
return result;
}
console.log(add(1,3,4));
console.log(add(1,3,4,9,100));
//类数组对象,arguments是类数组对象,自带
//for of
function d(){
var result=0;
for (var elem of arguments){
result+=elem;
}
return result;
}
console.log(d(1,3,4));
console.log(d(1,3,4,9,100));
//forEach
function ad(){
var result=0;
arguments.forEach(function(elem){
result+=elem;
})
return result;
}
console.log(ad(1,3,4));
console.log(ad(1,3,4,9,100));
</script>
for of与for in的区别
for | forEach | for of | for in | ||
数字下标 | 索引数组 | ✔ | ✔ | ✔ | 不保险 |
类数组对象 | ✔ | ✘ | ✔ | 不保险 | |
字符串 | ✔ | ✘ | ✔ | 不保险 | |
自定义名称下标 | 关联数组 | ✘ | ✘ | ✘ | ✔ |
对象 | ✘ | ✘ | ✘ | ✔ |
练习:使用循环打印30~20之间所有的整数
//初始值 var i=30;
while(i>=20){//循环条件
//循环体 console.log(i);
//i变化 i--;
}
//练习:使用循环打印50 55 60 65 70
var i=50;
while(i<=70){
console.log(i);
//i变化,每次加5
//i=i+5;
i+=5;
}
//练习:使用循环打印1~100之间所有的奇数,使用if判断
var i=1;
while(i<=100){
//i代表1~100之间所有的整数
//判断i是否为奇数
if(i%2===1){
console.log(i);
}
i++;
}
//练习:使用循环计算1~100之间所有整数的和
//循环产生1~100之间所有整数 var i=1;
//声明变量,用于记录总和,初始值为0
var sum=0;
while(i<=100){
//i代表1~100之间所有整数
//把每次产生的整数加到sum中
//sum在原来的基础之上加每一个整数 //sum=sum+i;
sum+=i;
/0+1+2+3...100
//每次往sum中加1个值,打印一次 /
console.log(sum);
i++;
}
//当循环结束后,打印最终的sum值
console.log(sum); */
//练习:计算1~100之间所有偶数的和
//循环产生1~100所有整数
//从中找到偶数
//把偶数相加到一起
var i=1;
//用于保存总和 var sum=0;
while(i<=100){
//i代表1~100所有整数
//从中找到偶数
if(i%2===0){
//i是所有偶数 //求和,把所有的偶数加到sum中
sum+=i;
//0+2+4..100
}
i++;
}
console.log(sum);
for in 用于遍历关联数组、对象
forEach 数组家的对象使用
for of 遍历数字下标的数组
break
在循环体中执行后,强制结束循环
循环结束的两种方式
当循环条件为false,结果
当循环条件中执行break后结束
/* //循环打印1~10
var i=1;
while(true){
//循环体
console.log(i);
//当i的值为10,强制结束循环
if(i===10){
break;
}
i++;
}
*/ //练习:使用死循环计算11~20之间所有整数的乘积
var i=11;
//声明变量,用于计算乘积,初始值是1
var s=1;
while(true){
//i是11~20所有整数
//console.log(i);
//把所有的整数乘以到s中 s*=i;
//当i为20的时候,结束循环
if(i===20){
break;
}
i++;
}
console.log(s);
(3)do-while
do 做
do{
循环体
}while(循环条件);
//循环打印0~9之间所有整数
var i=0; do{
//循环体
console.log(i);
//i变化 i++;
}while(i<10);
//循环条件
//练习:循环打印30~20之间所有的整数、
//初始值
var i=30;
do{ //循环体
console.log(i); //增量 i--;
}while(i>=20);//循环条件
//练习:循环打印60 63 66 69 72
//初始值 var i=60;
do{ //循环体
console.log(i); //增量 i+=3;
}while(i<=72);//循环条件
//练习:打印出1~100之间所有能被4整除的数,if判断
//循环产生1~100之间所有的整数
var i=1;
do{ //i就是1~100所有整数 //判断是否能被4整除
if(i%4===0){
console.log(i);
}
i++;
}while(i<=100);
//练习:计算1~100之间所有能被7整除的数字的和
//循环产生1~100之间所有整数
//从中找到能被7整除的数字
//求和
var i=1; //用于保存总和
//每次循环都要初始一次为0
var sum=0;
do{ //i代表1~100之间所有整数
//判断是否能被7整除
if(i%7===0){
//i代表能被7整除的数字
//求和,将所有能被7整除数字加到sum
sum+=i; }
i++;
}
while(i<=100);
//打印最终的sum
console.log(sum);
//练习:计算1~20之间所有能被3整除的数字的乘积
//循环产生1~20之间所有整数
//从中找到能被3整除的数字
//求乘积 var i=1;
/声明变量,记录乘积,初始值为1
var s=1;
do{ //i代表1~20之间所有整数
//判断是否能被3整除
if(i%3===0){
//i被3整除的数字
//求乘积,把这些整除乘以到s
s*=i; }
i++;
}while(i<=20);
console.log(s);
//练习:声明变量保存密码'123456',在死循环的循环体中弹出提示框,要求输入密码,如果输入的密码正确,就结束循环
var pwd='123456';
do{ //循环体
//获取用户输入的值
var str=prompt('input password');
//判断输入是否正确
if(str===pwd){
//结束循环 break;
}while(true); */
//使用循环条件判断密码是否正确
var pwd='123456';
do{
//用户输入的密码
var str=prompt('input password');
}while(str!==pwd);
//如果用户输入的密码不正确,继续循环(true)
//'666666'!=='123456'
//如果用户输入的密码正确,结束循环(false)
//'123456'!=='123456'
for循环 06——for.js
for(初始值(1)循环条件(2);增量 (4)){
循环体;(3
}while(循环条件);
//练习:循环打印80 75 70 65 60
for(var i=80;i>=60;i-=5){
console.log(i);
}
//练习:计算1~20之间所有奇数的乘积
//循环产生1~20之间所有整数
for(var i=1,s=1;i<=20;i++){
//i代表1~20之间所有整数
//判断i是否为奇数
if(i%2===1){
//相乘 s*=i;
}
}
console.log(s);
//练习:循环打印2000~2100之间所有的闰年
//循环产生所有的年份
//判断是否为闰年
for(var i=2000;i<=2100;i++){
//i就是所有的年份
//判断是否为闰年
if(i%4===0 && i%100!==0 || i%400===0){
console.log(i);
}
}
*/ //练习:循环打印九九乘法表的第5行
//12345
//1*5=5 2*5=10 3*5=15 4*5=20 5*5=25
for(var i=1,sum='';i<=5;i++){
sum+=i+'*5='+(i*5)+' ';
//''+1+2+3+4+5
} console.log(sum);
continue和break 继续 强制停止
1 2 3 4 5 6 7 8 9 10
break 一旦执行后,就会结束循环,不再执行循环中的代码
continue 跳过循环体,还会继续执行后续的循环
/* //打印1~10之间所有整数,不包括6
for(var i=1;i<=10;i++){
if(i===6){
//break;//结束循环
continue;//跳过循环体,继续往后执行后续的循环
}
console.log(i);
}
/ //练习:打印1~100之间所有的偶数,如果遇到奇数就跳过
//打印所有的整数
for(var i=1;i<=100;i++){
//如果i为奇数跳过
if(i%2===1){
continue;
}
console.log(i);
}
在循环体中又嵌套了另外一个循环,任意循环之间都可以相互嵌套
/* //打印1-100之间所有的整数,排除所有能被6整除或者能被7整除的数字
for(i=1;i<=100;i++){
//打印出1-100所有整数
//排除所有能被6整除或者能被7整除的数字
if(i%6===0 || i%7===0){
continue;
}
console.log(i);
}
*/ //打印2000-2100年之间前10个闰年
//求前面十个数的和
//设置变量保存前10的值
var s=0;
for(i=2000;i<=2100;i++){
//输出每个年份
//判断闰年有哪些
if(i%4===0 && i%100!==0 || i%400===0 ){
//输出所有闰年 console.log(i);
} if(s=0;s<=10;s++){
console.log(s);
}
}
循环值总是最后一个
把var 改为let
for of 就是 数组 一个值