为什么 pop() 方法在 map 方法中使用时停止工作？答案

【问题标题】：Why does the pop() method stop working when used within a map method?为什么 pop() 方法在 map 方法中使用时停止工作？
【发布时间】：2020-12-11 23:11:39
【问题描述】：

我想在不使用 reverse 方法的情况下将数组反转到位。我尝试了以下代码：

function reverseArray(arr) {
  return arr.map(() => {
    return arr.pop()
  })
}
console.log(reverseArray([1, 2, 3, 4]));
//logs [4,3,undefined,undefined]

使用开发工具调试器，控制台中的日志如下：(4) [4, 3, empty × 2]。

arr.pop() 如果在空数组上调用，则返回 undefined，但据我了解，在这种情况下它不应该为空。

问题：发生了什么？为什么前两个元素打印正确，而其余的则不正确？

【问题讨论】：

您在迭代数组时从数组中删除元素。
数组已经有了反向方法。为什么要重新发明轮子？
return arr[ arr.length - 1 - i ]; 应该做的工作
@Taplar 这个问题是关于不使用这种方法的。
我明白了。如果这是为了学习，很酷。否则，这只是浪费时间。

标签： javascript arrays dictionary

【解决方案1】：

在迭代数组时，您正在从数组中删除元素。 documentation 说：

map处理的元素范围是在第一次调用callback之前设置的。 ... 在调用 map 开始后和被访问之前被删除的元素不会被访问。

所以map() 一开始就确定它会迭代 4 次，创建一个包含 4 个元素的数组。

在第一次迭代中，arr.pop() 删除了 arr[3]。在第二次迭代中，它删除了arr[2]。

第三次迭代预计处理arr[2]。但由于该元素不再存在，它不会调用回调函数，而是将undefined 存储在结果数组中。同样的事情发生在第四次迭代中。

您可以遍历数组的副本。

function reverseArray(arr) {
  return [...arr].map(() => {
    return arr.pop()
  })
}
console.log(reverseArray([1, 2, 3, 4]));

【讨论】：

这个解决方案的问题是，它不像要求的那样到位
原始代码也不到位。 map() 总是创建一个新数组。
虽然这是真的，但问题是要求一个适当的解决方案。这就是我想知道的原因

【解决方案2】：

问题是，您 pop 一些元素，因此它们不再存在于数组中。所以，前两个元素是poped，另外两个元素写在那些地方，但在内部它们同时不再存在。

还有很多其他（更好的）解决方案，比如这个（来自here）：

function reverse (array) {
  var i = 0,
      n = array.length,
      middle = Math.floor(n / 2),
      temp = null;

  for (; i < middle; i += 1) {
     temp = array[i];
     array[i] = array[n - 1 - i];
     array[n - 1 - i] = temp;
  }
}

【讨论】：