JavaScript中使用map方法时出现数值拼接而非递增的问题

为什么会出现字符串拼接的结果？ #

• 误解了map的作用对象：practiceData是二维数组，外层map会遍历每个子数组，所以one函数的参数x是整个子数组（比如[14,21,23,64]），不是子数组里的单个数字。当执行x + 1时，数组会被自动转为字符串（比如"14,21,23,64"），然后和1做字符串拼接，就得到了末尾加1的结果。
• 函数里的for循环完全无效：刚进入循环就执行return，直接跳出函数，循环根本没机会遍历子数组元素。

怎么修复？ #

要实现每个数字加1，需要两层map：外层遍历每个子数组，内层遍历子数组里的每个数字，逐个加1。

修改后的代码：

const practiceData = [[14, 21, 23, 64], [33, 46, 51, 65]]
function one(x) {
    // 遍历子数组中的每个元素，执行加1操作
    return x.map(num => num + 1)
}

const out = practiceData.map(one);

console.log(out)

也可以用更简洁的嵌套箭头函数写法：

const practiceData = [[14, 21, 23, 64], [33, 46, 51, 65]]
const out = practiceData.map(subArr => subArr.map(num => num + 1))
console.log(out)

运行后会得到预期结果：[[15, 22, 24, 65], [34, 47, 52, 66]]

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