在 JavaScript 中循环遍历数组

沉浮于社会

在 Java 中，你可以用for循环遍历数组中的对象如下：
' x" [( C: ~! ]; `$ d& RString[] myStringArray = {"Hello","World"};for (String s : myStringArray){    / Do something}你能在 JavaScript 做同样的事吗？
                                                               
* F/ o# N+ C0 N5 F* N    解决方案:                                                               
+ q+ k- A! W  ^# t" Y4 R                                                                三大选项：
' \& k7 {8 y& ?& y[ol]for (var i = 0; i
, ]+ I( E2 j' U. V% U7 Cxs.forEach((x,i) => console.log(x));
for (const x of xs) { console.log(x); }[/ol]详细示例如下。
1.顺序for循环：

• var myStringArray = ["Hello","World"];var arrayLength = myStringArray.length;for (var i = 0; i 优点
  4 [7 U9 A! K3 _
• 
  ; V0 j9 m2 T9 i; ]: O( K: |# N' X
• 适用于各种环境
  
• 您可以使用break和continue流控制语句缺点
  3 R- e, P; ]. h5 Y3 l' P- F( k
• 
  ) Y% \( D6 c4 d  ]; H  i  l( [' _& A
• 太冗长
  7 Y: G1 n/ n+ M% k0 e0 v' x
• 至关重要的
  
• 一个错误很容易出现(有时也被称为一个错误)栅栏柱错误）2 Array.prototype.forEach.：所述ES说明书介绍了许多有益的阵列方法。其中之一，Array.prototype.forEach，给我们一个迭代数组的简单方法：[code]const array = ["one","two","three"]array.forEach(function (item,index) {  console.log(item,index);});
  3 x  `" `' T6 I) ~" C& i

距离编写 ES5 标准发布时间(2009年 12 月)近十年，几乎所有现代引擎都在桌面、服务器和移动环境中实现，使用安全。
, @  Z" m. Q. c8 H; p7 [. P并且使用 ES6 箭头函数语法更简洁：

array.forEach(item => console.log(item));
% N- _- |. ~- \# h( J6 v

除非您计划支持古老的平台（例如，Internet Explorer 11)，否则箭头函数也会被广泛实现；你也可以安全地去。
6 t" n! O9 }+ r8 G% q) j" ?优点
非常简短和简洁。
3 A6 s8 R$ U" E( @声明式缺点
不能使用break/continue通常，你可以break通过在迭代数组元素之前过滤数组元素来替换退出命令循环的需要，例如：
' }6 N6 D+ P* ^' x. J6 w

array.filter(item => item.condition  console.log(item))

请记住，如果您正在迭代一个数组构建另一个数组，您应该使用map. 我多次看到这种反模式。
- ]* G5 |3 m  @4 {反模式：
/ }. Z5 k8 k3 s+ F7 b; g7 H1 I7 l

• const numbers = doubled = [];numbers.forEach((n,i) => { doubled = n * 2 }code]*地图的*正确用例：[code]const numbers = [1，2，3，4，5]；const doubled = numbers.map(n => n * 2);console.log(doubled);
  

另外，如果你想的话降低例如，要总结数字数组，你应该使用它减少方法。
反模式：

• const numbers = [1，2，3，4，5]；const sum = 0;numbers.forEach(num => { sum  = num(//code]正确使用*reduce*：[code]const numbers = [1，2，3，4，5]；const sum = numbers.reduce((total,n) => total   n,0);console.log(sum);
  , G: d1 A( g2 x

3. ES6for-of声明：所述ES6标准引入了迭代对象的概念，并限制了新的构建for...of的语句。
该语句适用于任何类型的可迭代对象和生成器(任何具有\[Symbol.iterator\]属性对象)。
数组对象是 ES内置可迭代对象在6 中定义，因此您可以使用以下句子：
/ A% N, F! [1 U8 q

let colors = ['red','green','blue'];for (const color of colors){    console.log(color);}
& c$ |+ f+ z; s' E& g9 x

优点
* x3 p4 {8 `! }它可以迭代各种对象。
可以使用正常的流控制语句（break/ continue）。
- m, r5 |' X  `1 n% P/ M, a+ ^* s对迭代串行异步值非常有用。缺点
如果你的目标是旧浏览器，转译后的输出可能会让你大吃一惊。不使用 for...in@zipcodeman 建议使用这个for...in语句，但for-in该语句旨在避免迭代数组枚举对象属性。
/ s. M9 d& m3 Z' {( ^由于：
( i) ^2 J. w8 C7 N不保证迭代顺序；数组索引可能不会按数字顺序访问。
# F2 l# J: P  p% [2 a9 `还列出了继承的属性。第二点是，如果你扩展，它会给你带来很多问题。Array.prototype如果对象包含一种方法，则该属性也将被列举。
. E  |, Z5 x. s! B! a0 O# w8 S例如：

Array.prototype.foo = "foo!";var array = ['a','b','c'];for (var i in array)    console.log(array);}

控制台记录上述代码a”、“b”、“c”和“foo！”。
如果使用一些严重依赖原型增强的库(如MooTools），这可能是一个特殊的问题。
9 d" a# e" c1 {6 X8 U; |4 Ffor-in正如我之前所说，这句话是用来用的枚举例如：
# g; {$ O+ d, z$ ~, E[code]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])  code]在上面的例子中，该hasOwnProperty方法只允许您枚举自己的属性。这样，只有对象物理的属性，没有继承的属性。