在Java中,您可以使用for循环遍历数组中的对象,如下所示:
String[] myStringArray = {"Hello", "World"}; for (String s : myStringArray) { // Do something }
您可以在JavaScript中做同样的事情吗?
您有几种选择:
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流控制语句
break
continue
缺点
2. Array.prototype.forEach
ES5规范引入了许多有益的数组方法,其中之一是,Array.prototype.forEach它为我们提供了一种遍历数组的简洁方法:
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),否则箭头功能也得到了广泛的实现。你也很安全。
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语句。
for...of
该语句适用于任何类型的可迭代对象,也适用于生成器(任何具有[Symbol.iterator]属性的对象)。
[Symbol.iterator]
根据定义,数组对象是ES6中的内置可迭代对象,因此可以在它们上使用此语句:
let colors = ['red', 'green', 'blue']; for (const color of colors){ console.log(color); }
break/ continue
如果您以较旧的浏览器为目标,则转换后的输出可能会让您感到惊讶。
不使用 for...in
for...in
@zipcodeman建议使用该for...in语句,但是为了for-in避免迭代数组,该语句旨在枚举对象属性。
for-in
不应将其用于类似数组的对象,因为:
第二点是它会给您带来很多问题,例如,如果您扩展Array.prototype对象以在其中包含方法,那么该属性也会被枚举。
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方法仅允许您枚举自己的属性,仅枚举对象物理上具有的属性,而没有枚举属性。