Question

我用Javascript编写，我已经习惯于使用数组助手，因为我读过很多博客告诉我如果可能的话，完全远离for循环。但是有一些情况我需要迭代，数组助手比for循环更不直观，更麻烦。当你选择在数组助手上使用传统循环时，你能给我一个列表吗？谢谢！

Answer 1

突破循环

你不能打破数组助手。因此，如果您需要突破循环，则需要使用传统循环。

使用内部yield/await

由于您无法将generator或async函数作为循环callback传递，因此您需要使用传统循环。

Answer 2

如果我需要突破迭代，那么我会选择使用传统的循环。这是因为break使用数组助手没有内置功能。</ p>
如果我编写的代码需要具有最高的性能并且可读性不是一个大问题，那么我将采用传统的循环方式。我相信传统的循环通常比使用数组助手更快（非常轻微）

Answer 3

使用任何使代码更具可读性的方法。（只要您不使用 for..in ）

您可以使用for，for..in，for..of或forEach（或some或every）。它们处理稀疏数组和非数字可枚举属性的方式有所不同。

您是否需要知道数组中元素的索引？
您要如何处理未定义的元素？
您要处理所有元素还是要在某些情况下中断？
如果使用 for..in ，您是否准备处理在Array.prototype或Object.prototype上定义的非数字可枚举属性？（请参见下文）
人类更容易阅读和理解什么？

您可以测试以下功能。数组是稀疏的，我在Object.prototype，Array.prototype和本地数组上添加了数字和非数字属性，以显示发生了什么。

Object.defineProperties(Object.prototype, {
  globalObjectUnenumerableProperty: { value: "might be ok", enumerable: false },
  globalObjectEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true },
  "10": { value: "Missuse on Object, non-enumerable", enumerable: false },
  "11": { value: "Missuse on Object, enumerable", enumerable: true }
});

Object.defineProperties(Array.prototype, {
  globalArrayUnenumerableProperty: { value: "might be ok", enumerable: false },
  globalArrayEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true },
  "12": { value: "Missuse on Array, non-enumerable", enumerable: false },
  "13": { value: "Missuse on Array, enumerable", enumerable: true }
});

const data = ["A", "B", "C"];

data[23] = "X";
data[24] = "Y";
data[25] = "Z";

Object.defineProperties(data, {
  localUnenumerableProperty: { value: "localUnenumerable", enumerable: false },
  localEnumerableProperty: { value: "localMissuseOfArray", enumerable: true }
});

进行 26次迭代，稀疏数组容易受到链中任何位置的数字属性的影响

const data = ["A", "B", "C"]; data[23] = "X"; data[24] = "Y"; data[25] = "Z"; Object.defineProperties(Object.prototype, { globalObjectUnenumerableProperty: { value: "might be ok", enumerable: false }, globalObjectEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "10": { value: "Missuse on Object, non-enumerable", enumerable: false }, "11": { value: "Missuse on Object, enumerable", enumerable: true } }); Object.defineProperties(Array.prototype, { globalArrayUnenumerableProperty: { value: "might be ok", enumerable: false }, globalArrayEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "12": { value: "Missuse on Array, non-enumerable", enumerable: false }, "13": { value: "Missuse on Array, enumerable", enumerable: true } }); Object.defineProperties(data, { localUnenumerableProperty: { value: "localUnenumerable", enumerable: false }, localEnumerableProperty: { value: "localMissuseOfArray", enumerable: true } });

for (let i = 0, len = data.length; i < len; ++i) console.log(i, data[i]);

for..in 11次迭代，容易受到链中所有枚举属性的影响

请注意， for..in 包含在原型链中任何位置定义的可枚举属性。它可以在本地数组， Array.prototype 或 Object.prototype 上。

const data = ["A", "B", "C"]; data[23] = "X"; data[24] = "Y"; data[25] = "Z"; Object.defineProperties(Object.prototype, { globalObjectUnenumerableProperty: { value: "might be ok", enumerable: false }, globalObjectEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "10": { value: "Missuse on Object, non-enumerable", enumerable: false }, "11": { value: "Missuse on Object, enumerable", enumerable: true } }); Object.defineProperties(Array.prototype, { globalArrayUnenumerableProperty: { value: "might be ok", enumerable: false }, globalArrayEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "12": { value: "Missuse on Array, non-enumerable", enumerable: false }, "13": { value: "Missuse on Array, enumerable", enumerable: true } }); Object.defineProperties(data, { localUnenumerableProperty: { value: "localUnenumerable", enumerable: false }, localEnumerableProperty: { value: "localMissuseOfArray", enumerable: true } });

for (const index in data) console.log(index, data[index]);

forEach 10次迭代，稀疏数组容易受到原型链中任何位置的数字属性的影响。

const data = ["A", "B", "C"]; data[23] = "X"; data[24] = "Y"; data[25] = "Z"; Object.defineProperties(Object.prototype, { globalObjectUnenumerableProperty: { value: "might be ok", enumerable: false }, globalObjectEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "10": { value: "Missuse on Object, non-enumerable", enumerable: false }, "11": { value: "Missuse on Object, enumerable", enumerable: true } }); Object.defineProperties(Array.prototype, { globalArrayUnenumerableProperty: { value: "might be ok", enumerable: false }, globalArrayEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "12": { value: "Missuse on Array, non-enumerable", enumerable: false }, "13": { value: "Missuse on Array, enumerable", enumerable: true } }); Object.defineProperties(data, { localUnenumerableProperty: { value: "localUnenumerable", enumerable: false }, localEnumerableProperty: { value: "localMissuseOfArray", enumerable: true } });

data.forEach((value, index) => console.log(index, value));

.. of 26次迭代，没有索引，稀疏数组容易受到链中任何位置的数字属性的影响

const data = ["A", "B", "C"]; data[23] = "X"; data[24] = "Y"; data[25] = "Z"; Object.defineProperties(Object.prototype, { globalObjectUnenumerableProperty: { value: "might be ok", enumerable: false }, globalObjectEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "10": { value: "Missuse on Object, non-enumerable", enumerable: false }, "11": { value: "Missuse on Object, enumerable", enumerable: true } }); Object.defineProperties(Array.prototype, { globalArrayUnenumerableProperty: { value: "might be ok", enumerable: false }, globalArrayEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "12": { value: "Missuse on Array, non-enumerable", enumerable: false }, "13": { value: "Missuse on Array, enumerable", enumerable: true } }); Object.defineProperties(data, { localUnenumerableProperty: { value: "localUnenumerable", enumerable: false }, localEnumerableProperty: { value: "localMissuseOfArray", enumerable: true } });

console.log("for..of, 26 iterations, no index, space arrays vulrenable to numeric properties on Array and Object");
for (const value of data) console.log(value);

for..of Object.entries（） 7次迭代，包括本地数组上的可枚举属性。

const data = ["A", "B", "C"]; data[23] = "X"; data[24] = "Y"; data[25] = "Z"; Object.defineProperties(Object.prototype, { globalObjectUnenumerableProperty: { value: "might be ok", enumerable: false }, globalObjectEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "10": { value: "Missuse on Object, non-enumerable", enumerable: false }, "11": { value: "Missuse on Object, enumerable", enumerable: true } }); Object.defineProperties(Array.prototype, { globalArrayUnenumerableProperty: { value: "might be ok", enumerable: false }, globalArrayEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "12": { value: "Missuse on Array, non-enumerable", enumerable: false }, "13": { value: "Missuse on Array, enumerable", enumerable: true } }); Object.defineProperties(data, { localUnenumerableProperty: { value: "localUnenumerable", enumerable: false }, localEnumerableProperty: { value: "localMissuseOfArray", enumerable: true } });

for (const [index, value] of Object.entries(data)) console.log(index, value);

大约 9次迭代，稀疏数组容易受到链中任何位置的数字属性的影响

const data = ["A", "B", "C"]; data[23] = "X"; data[24] = "Y"; data[25] = "Z"; Object.defineProperties(Object.prototype, { globalObjectUnenumerableProperty: { value: "might be ok", enumerable: false }, globalObjectEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "10": { value: "Missuse on Object, non-enumerable", enumerable: false }, "11": { value: "Missuse on Object, enumerable", enumerable: true } }); Object.defineProperties(Array.prototype, { globalArrayUnenumerableProperty: { value: "might be ok", enumerable: false }, globalArrayEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "12": { value: "Missuse on Array, non-enumerable", enumerable: false }, "13": { value: "Missuse on Array, enumerable", enumerable: true } }); Object.defineProperties(data, { localUnenumerableProperty: { value: "localUnenumerable", enumerable: false }, localEnumerableProperty: { value: "localMissuseOfArray", enumerable: true } });

data.some((value, index) => {
  console.log(value, index);
  return value === "Y"; // Exit loop if value is "Y"
});

每 9次迭代，稀疏数组容易受到链中任何位置的数字属性的影响

const data = ["A", "B", "C"]; data[23] = "X"; data[24] = "Y"; data[25] = "Z"; Object.defineProperties(Object.prototype, { globalObjectUnenumerableProperty: { value: "might be ok", enumerable: false }, globalObjectEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "10": { value: "Missuse on Object, non-enumerable", enumerable: false }, "11": { value: "Missuse on Object, enumerable", enumerable: true } }); Object.defineProperties(Array.prototype, { globalArrayUnenumerableProperty: { value: "might be ok", enumerable: false }, globalArrayEnumerableProperty: { value: "breaks arrays for everyone", enumerable: true }, "12": { value: "Missuse on Array, non-enumerable", enumerable: false }, "13": { value: "Missuse on Array, enumerable", enumerable: true } }); Object.defineProperties(data, { localUnenumerableProperty: { value: "localUnenumerable", enumerable: false }, localEnumerableProperty: { value: "localMissuseOfArray", enumerable: true } });

data.every((value, index) => {
  console.log(value, index);
  return value !== "Y"; // Exit loop if value is "Y"
});

Answer 4

让我通过使用一些用例来告诉您 1.使用经典或传统的for loop over数组助手功能取决于用例

让我比较一下forEach帮助器的经典for循环 1.少编写代码，将语法错误的风险降到最低，在for循环中，如提供条件时，我们可能会遇到逻辑或语法错误。 2.提取-遍历数据时。如果数据较少，那么经典的for循环将花费较少的时间，如果数据较多，则可能花费较长的时间。

何时使用传统循环而非数组助手

4 个答案: