为何JS的map方法返回[0,2,6,12]？首个元素为0的原因

嘿，这个问题其实是因为你对Array.map()给回调函数传递的参数理解有点偏差，我来给你掰扯清楚～

首先先把你的代码贴出来方便对照：

const x = [1, 2, 3, 4]
function multiply(a, b) { return a * b }
console.log(x.map(multiply)) // 输出 [0, 2, 6, 12]

你困惑的核心点在于：原数组第一个元素是1，怎么map出来就变成0了？答案很简单——Array.map()会给它的回调函数自动传递三个参数，而你的multiply函数刚好接收两个参数，这就导致第二个参数被当成了b的值。

具体拆解每一步计算： #

当map遍历数组时，每次调用multiply都会传入这三个参数：

1. 当前遍历到的数组元素（currentValue）
2. 当前元素的索引（index）
3. 原数组本身（这个你没用到，所以可以忽略）

那咱们逐个看遍历过程：

• 第一次遍历（第一个元素1）：multiply(1, 0) → 1 * 0 = 0
• 第二次遍历（第二个元素2）：multiply(2, 1) → 2 * 1 = 2
• 第三次遍历（第三个元素3）：multiply(3, 2) → 3 * 2 = 6
• 第四次遍历（第四个元素4）：multiply(4, 3) → 4 * 3 = 12

这就完美对应了你看到的输出结果！

怎么修正？ #

如果你本来有自己的计算需求，可以通过两种方式调整：

1. 如果你想让每个元素乘以自身：

// 让multiply只使用第一个参数
function multiply(a) { return a * a }
console.log(x.map(multiply)) // 输出 [1, 4, 9, 16]

2. 如果你想让元素乘以某个固定数（比如2）：

// 用箭头函数包装，手动传递需要的参数
console.log(x.map(num => multiply(num, 2))) // 输出 [2, 4, 6, 8]

内容的提问来源于stack exchange，提问作者HarshSharma