Question

我知道下面的代码最糟糕。但是，我想知道为什么吗？

const hello = (list) => {
    list = list.map((item, index) => {
        if (index === 3) {
            list.splice(index, 1)
        }

        return item
    })

    console.log(list)
}
hello([1, 2, 3, 4])

为什么结果是[1,2,3,4]，而不是[1,2,3]？

非常感谢！

Answer 1

.map创建一个 new 数组，该数组是根据旧数组上每次迭代的返回值创建的。您的

return item

在.map内的

意味着创建的新数组将与原始数组完全相同。

即使同时更改了数组，也将使用.map的回调调用数组的每个元素-原始list数组已获得splice d的事实并不不会产生任何可见的效果，因为.map在调用.map时已经引用了数组开头的每个项目。

如果您在映射前之前拼接了第3项，则结果的确是[1, 2, 3]：

const hello = (list) => {
  list.splice(3, 1);
  list = list.map((item, index) => {
    return item
  })
  console.log(list)
}
hello([1, 2, 3, 4])

Answer 2

如果您在Array.prototype.map docs中看到有关如何实现map的polyfill部分，则会看到复制了调用map的数组最初是一个变量。

然后使用循环遍历复制数组的元素，直到达到数组的长度。在每次迭代中，您提供的回调函数都会被调用以转换数组的每个元素，并将其放入一个新的数组中，然后从map函数返回该数组。

因此，即使您在调用map之后对数组进行了更改，它仍将引用原始数据而不是新数据。

如果要跳过某些元素，则应使用filter而不是map。

const hello = (list) => {
    list = list.filter((item, index) => {
       return index !== 3;
    })
    console.log(list)
}
hello([1, 2, 3, 4])

javascript当映射数组和Sametime拼接数组时，结果是....？

2 个答案: