javascript中for,foreach,for...in,for...of的对比

以数组为例,JavaScript 提供多种遍历语法。最原始的写法就是for循环。

for (var index = 0; index < myArray.length; index++) {
console.log(myArray[index]);
}
这种写法比较麻烦,因此数组提供内置的forEach方法。

myArray.forEach(function (value) {
console.log(value);
});
这种写法的问题在于,无法中途跳出forEach循环,break命令或return命令都不能奏效。

for...in循环可以遍历数组的键名。

for (var index in myArray) {
console.log(myArray[index]);
}
for...in循环有几个缺点。

数组的键名是数字,但是for...in循环是以字符串作为键名“0”、“1”、“2”等等。
for...in循环不仅遍历数字键名,还会遍历手动添加的其他键,甚至包括原型链上的键。
某些情况下,for...in循环会以任意顺序遍历键名。
总之,for...in循环主要是为遍历对象而设计的,不适用于遍历数组。

for...of循环相比上面几种做法,有一些显著的优点。

for (let value of myArray) {
console.log(value);
}
有着同for...in一样的简洁语法,但是没有for...in那些缺点。
不同于forEach方法,它可以与break、continue和return配合使用。
提供了遍历所有数据结构的统一操作接口。
下面是一个使用 break 语句,跳出for...of循环的例子。

for (var n of fibonacci) {
if (n > 1000)
break;
console.log(n);
}
上面的例子,会输出斐波纳契数列小于等于 1000 的项。如果当前项大于 1000,就会使用break语句跳出for...of循环。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 第2章 基本语法 2.1 概述 基本句法和变量 语句 JavaScript程序的执行单位为行(line),也就是一...
    悟名先生阅读 4,684评论 0 13
  • 对数组的遍历大家最常用的就是for循环,ES5的话也可以使用forEach,ES5具有遍历数组功能的还有map、f...
    筱筱岳阅读 15,058评论 0 0
  • 在ECMAScript5(简称 ES5)中,有三种 for 循环,分别是: 简单for循环 for-in forE...
    l4u阅读 679评论 0 0
  • 原生具备 Iterator 接口的数据结构如下。ArrayMapSetStringTypedArray函数的 ar...
    zjh111阅读 556评论 0 0
  • 有心摘花花不成,无心插柳柳成荫!让一切顺其自然吧!不甘心,不满意,很寂寞,很忧虑,再等等,或许柳暗花明又一村吧!
    蓝蝴蝶罂粟阅读 325评论 0 0

友情链接更多精彩内容