您有几种选择:
1.顺序for循环:
var myStringArray = ["Hello","World"];var arrayLength = myStringArray.length;for (var i = 0; i < arrayLength; i++) { console.log(myStringArray[i]); //Do something}优点
适用于各种环境
您可以使用
break和
continue流控制语句
缺点
- 太冗长
- 势在必行
- 容易出现一对一的错误(有时也称为栅栏错误)
2. Array.prototype.forEach
ES5规范引入了许多有益的数组方法,其中之一是,
Array.prototype.forEach它为我们提供了一种遍历数组的简洁方法:
const array = ["one", "two", "three"]array.forEach(function (item, index) { console.log(item, index);});ES5规范发布时(截至2009年12月)已经有将近十年的时间,它已经由台式机,服务器和移动环境中的几乎所有现代引擎实现,因此可以安全地使用它们。
借助ES6箭头函数语法,它更加简洁:
array.forEach(item => console.log(item));
除非计划支持古老的平台(例如IE11),否则箭头功能也得到了广泛的实现。你也很安全。
优点
- 非常简短。
- 陈述式
缺点
- 无法使用break/continue
通常,您可以break通过在迭代数组元素之前对它们进行过滤来替换命令式循环,例如:
array.filter(item => item.condition < 10) .forEach(item => console.log(item))
请记住,如果要迭代一个数组以从中构建另一个数组,则应使用map,我已经看过很多次这种反模式了。
反模式:
const numbers = [1,2,3,4,5], doubled = [];numbers.forEach((n, i) => { doubled[i] = n * 2 });map的正确用例:
const numbers = [1,2,3,4,5];const doubled = numbers.map(n => n * 2);console.log(doubled);
同样,例如,如果您尝试将数组缩小为一个值,则想对数字数组求和,则应使用reduce方法。
反模式:
const numbers = [1,2,3,4,5];const sum = 0;numbers.forEach(num => { sum += num });正确使用reduce:
const numbers = [1,2,3,4,5];const sum = numbers.reduce((total, n) => total + n, 0);console.log(sum);
3. ES6 for-of声明
ES6标准引入了可迭代对象的概念,并定义了用于遍历数据的新结构,即
for...of语句。
该语句适用于任何类型的可迭代对象,也适用于生成器(任何具有
[Symbol.iterator]属性的对象)。
根据定义,数组对象是ES6中的内置可迭代对象,因此可以在它们上使用此语句:
let colors = ['red', 'green', 'blue'];for (const color of colors){ console.log(color);}优点
- 它可以遍历各种各样的对象。
- 可以使用普通的流控制语句(
break/ continue
)。 - 对迭代串行异步值很有用。
缺点
如果您以较旧的浏览器为目标,则转换后的输出可能会让您感到惊讶。
不使用 for...in
@zippreman建议使用该
for...in语句,但是为了
for-in避免迭代数组,该语句旨在枚举对象属性。
不应将其用于类似数组的对象,因为:
- 不能保证迭代的顺序。不能按数字顺序访问数组索引。
- 继承的属性也被枚举。
第二点是它会给您带来很多问题,例如,如果您扩展
Array.prototype对象以在其中包含方法,那么该属性也会被枚举。
例如:
Array.prototype.foo = "foo!";var array = ['a', 'b', 'c'];for (var i in array) { console.log(array[i]);}上面的代码将控制台日志“ a”,“ b”,“ c”和“ foo!”。
如果您使用一些严重依赖本机原型扩充的库(例如MooTools),则可能会尤其成问题。
for-in我之前说过的语句用来枚举对象属性,例如:
var obj = { "a": 1, "b": 2, "c": 3};for (var prop in obj) { if (obj.hasOwnProperty(prop)) { // or if (Object.prototype.hasOwnProperty.call(obj,prop)) for safety... console.log("prop: " + prop + " value: " + obj[prop]) }}在上面的示例中,该hasOwnProperty方法仅允许您枚举自己的属性,仅枚举对象物理上具有的属性,而没有枚举属性。



