在 JavaScript 中循环遍历数组

沉浮于社会

在 Java 中，你可以用for循环遍历数组中的对象如下：
String[] myStringArray = {"Hello","World"};for (String s : myStringArray){    / Do something}你能在 JavaScript 做同样的事吗？
                                                               
    解决方案:                                                               
) a2 r( e! n' J                                                                三大选项：
[ol]for (var i = 0; i
, q9 ]+ S& _9 b. w0 Fxs.forEach((x,i) => console.log(x));
for (const x of xs) { console.log(x); }[/ol]详细示例如下。
3 E# F8 {) t: u! d1.顺序for循环：

/ P( x5 W1 \8 H' U2 g1 u1 i$ a
• var myStringArray = ["Hello","World"];var arrayLength = myStringArray.length;for (var i = 0; i 优点
  
• 
  
• 适用于各种环境
  
• 您可以使用break和continue流控制语句缺点
  4 @' l, O5 s- E- p& p
• 
  : B5 d4 U. N/ ]4 j1 Z/ ~
• 太冗长
  7 H9 `: v" o! u+ L# n) g0 x
• 至关重要的
  3 g+ {# R6 P" q3 T4 P. `
• 一个错误很容易出现(有时也被称为一个错误)栅栏柱错误）2 Array.prototype.forEach.：所述ES说明书介绍了许多有益的阵列方法。其中之一，Array.prototype.forEach，给我们一个迭代数组的简单方法：[code]const array = ["one","two","three"]array.forEach(function (item,index) {  console.log(item,index);});
  " |$ P3 c; e% b7 B

距离编写 ES5 标准发布时间(2009年 12 月)近十年，几乎所有现代引擎都在桌面、服务器和移动环境中实现，使用安全。
) ~0 h  }0 V* v" i1 K9 w  H并且使用 ES6 箭头函数语法更简洁：
7 z; j7 y5 r5 Y) ]+ {" e: q

array.forEach(item => console.log(item));

除非您计划支持古老的平台（例如，Internet Explorer 11)，否则箭头函数也会被广泛实现；你也可以安全地去。
优点
非常简短和简洁。
- M' z! C! l8 [3 t" M' b声明式缺点
/ l' W# x3 @1 Z( r1 z不能使用break/continue通常，你可以break通过在迭代数组元素之前过滤数组元素来替换退出命令循环的需要，例如：
, X; U# X) o1 L; Z$ B" B6 `- d1 S

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

请记住，如果您正在迭代一个数组构建另一个数组，您应该使用map. 我多次看到这种反模式。
  |8 h  b) @6 g+ O2 U' k, o反模式：

  K, e, v/ z& r
• 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);
  2 C! k" b+ B. k# X. C2 n' T! t

另外，如果你想的话降低例如，要总结数字数组，你应该使用它减少方法。
反模式：
8 \2 k2 I2 |6 B& g$ V+ f  r% a0 @# T" _

( V" A" L+ ~9 S, P
• 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);
  

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

let colors = ['red','green','blue'];for (const color of colors){    console.log(color);}
' U/ y0 I# m0 e1 f

优点
' m# [! ^' _0 c: r: w它可以迭代各种对象。
可以使用正常的流控制语句（break/ continue）。
6 o! p$ ]  U" h& B对迭代串行异步值非常有用。缺点
如果你的目标是旧浏览器，转译后的输出可能会让你大吃一惊。不使用 for...in@zipcodeman 建议使用这个for...in语句，但for-in该语句旨在避免迭代数组枚举对象属性。
$ N& ?0 g* T. s  _( v4 J5 L0 l由于：
不保证迭代顺序；数组索引可能不会按数字顺序访问。
9 C; F2 I! g9 _' X( V% x9 E还列出了继承的属性。第二点是，如果你扩展，它会给你带来很多问题。Array.prototype如果对象包含一种方法，则该属性也将被列举。
例如：
2 ]; @# p* _2 Z2 ?

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

控制台记录上述代码a”、“b”、“c”和“foo！”。
如果使用一些严重依赖原型增强的库(如MooTools），这可能是一个特殊的问题。
$ S6 N0 |, J6 f8 Jfor-in正如我之前所说，这句话是用来用的枚举例如：
. ]: ~6 ?  q1 I- M& R[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方法只允许您枚举自己的属性。这样，只有对象物理的属性，没有继承的属性。