1 、 for
var arr = [1,2,3];
var len = arr.length;
// for break
for(var i = 0; i < len; i += 1){
for(var j = 0; j < 3; j++){
if(j === 1){
break;
}
console.log(arr[i]+'-'+j);
}
}
结果:
1)break:break退出当前循环,也就是第二层循环
var arr = [1,2,3];
var len = arr.length;
// for continue
for(var i = 0; i < len; i += 1){
for(var j = 0; j < 3; j++){
if(j === 1){
continue;
}
console.log(arr[i]+'-'+j);
}
}
结果:
2)continue:continue停止当前循环的执行,继续下一次循环(都是针对第二层)
tips:for循环里不能有return!
2 、 forEach
var arr = [1,2,3];
arr.forEach(function(value,index) {
if(index === 1){
return false;
}
console.log(arr[index])
});
结果:
1)return false:结束本次循环,进入下一次循环
var arr = [1,2,3];
arr.forEach(function(value,index) {
if(index === 1){
return true;
}
console.log(arr[index])
});
结果:
2)return true:结束本次循环,进入下一次循环
3 、 Array.map
map和forEach差不多,区别是map的返回值是一个数组
4、 for…in
var arr = [1,2,3];
for(var i in arr){
if(i === 1){
break
}
console.log(i)
}
结果:
1)for…in : break或者continue对遍历无影响,当有return时会报错
5、for…of
var arr = [1,2,3];
for(var i of arr){
if(i === 2){
break
}
console.log(i)
}
结果:
- break: 跳出当前循环,和for类似,
需要注意的是这里的 i 是arr的value而不是index
var arr = [1,2,3];
for(var i of arr){
if(i === 2){
continue
}
console.log(i)
}
结果:
2)continue:结束本次循环,和for类似,
tips:for…of循环里不能有return!第一个参数是值
6、$.each()
var arr = [1,2,3];
$.each(arr,function(index,value){
if(index === 1){
return false;
}
console.log(value);
})
结果:
1) return false:跳出本次循环!
var arr = [1,2,3];
$.each(arr,function(index,value){
if(index === 1){
return true;
}
console.log(value);
})
结果:
2) return true:结束本次循环!tips:$.each循环里不能有break||continue!
看了这么多代码块和输出结果后,那就总结一下啊:咳咳,划重点咯:
1、for:当没有label标记时候,break跳出本次循环并执行循环体后的代码,continue结束本次循环执行下一次循环。没有return。
2、 Array.forEach:遍历整个数组,return false或者true都是结束本次循环执行下一次循环。没有break || continue。
3、 Array.map:map和forEach类似,有返回值,返回结果是return 值组成的数组。
4、for…in:会忽略break || continue。没有return。
5、 for…of:break跳出本次循环并执行循环体后的代码,continue结束本次循环执行下一次循环,和for一样。注意:for(var v in arr)v是数组值!。
6、Jquery.each: return false跳出本次循环并执行循环体后的代码;return true结束本次循环执行下一次循环。没有break || continue。