javascript - 在迭代期间添加新元素后的循环次数。 forEach 与 for/of

Question

是否有人注意到循环构造 forEach 和 for/of 对“在迭代期间添加”项目的行为？ ForEach 忽略了数组中有新添加的项目这一事实，并且 for/of 动态更改迭代器并继续运行，直到数组中没有元素为止。出现这种现象的原因是什么，用聪明的话？ stackoverflow 上的第 1 篇文章，所以无法判断解释是否简单....谢谢

let my_array1 = [1,2,3]
let my_array2 = ["a", "b", "c"]

//extra iteration cycles were not dynamically added. Loop ends after pre-defined # of cycles.
my_array1.forEach((value, index, the_array) => {
  if (value == 3){
    // my_array1.push(3)
    the_array.push(3)  // works like so as well
  }
})

console.log(`my_array1 after iteration ${my_array1}`)

//extra iteration cycles WERE dynamically added. Infinite loop!!!
for (let value of my_array2){
  if (value == "c"){
    my_array2.push("c")
  }
}

console.log(`my_array2 after iteration ${my_array2}`)

Answer 1

您必须查看规范(或者，对于非 native 方法，无论您使用什么，都要查看文档)以查看行为是什么。例如，使用 Array.prototype.forEach ，你can see :

1. Let O be ? ToObject(this value).
2. Let len be ? LengthOfArrayLike(O).
3. If IsCallable(callbackfn) is false, throw a TypeError exception.
4. Let k be 0.
5. Repeat, while k < len,
  a. Let Pk be ! ToString(𝔽(k)).
  b. Let kPresent be ? HasProperty(O, Pk).
  c. If kPresent is true, then
    i. Let kValue be ? Get(O, Pk).
    ii. Perform ? Call(callbackfn, thisArg, « kValue, 𝔽(k), O »).
  d. Set k to k + 1.
6. Return undefined.

如您所见，它在 k < len 期间进行迭代, 和 len在操作开始时分配给，在步骤 2 中，因此不考虑在迭代期间添加到数组的元素。 (不过，在迭代期间更改的元素将被看到 - 因为值是在每次迭代中使用 Get(O, Pk) 检索的)

for..of ，另一方面，用于 iterables :

Return ? GetIterator(exprValue, iteratorHint).

，以及那个迭代器 is then called直到迭代器耗尽

a. Let nextResult be ? Call(iteratorRecord.[[NextMethod]], iteratorRecord.[[Iterator]])

和数组迭代器做包括迭代期间添加到数组的项目，您可以看到 here .它执行

vi. Set index to index + 1.

在迭代结束时，在屈服之后，在迭代开始时，查找该索引处的值。因此，在迭代器调用期间添加的元素将在迭代器的结果中看到，直到迭代器位于数组中的最后一个元素上并且没有更多元素为止。