JavaScript中如何克隆数组且交换最内层元素不修改原数组？

问题原因 #

你使用的展开运算符[...arr]仅能实现一维数组的浅拷贝，你的primera是三维嵌套数组，第二层、第三层的子数组仍然和原数组共用同一份引用，所以修改newArr[i][j]的时候会同步修改原数组的对应内容。

解决方案 #

你可以选择逐层拷贝对应层级的数组切断引用关联，这里提供两种实现方式：

1. 基于你原有代码修改的版本：

const doubleRound = (arr) => {
  const newArr = [...arr]
  for(let i=0; i<newArr.length;i++) {
    // 新增第二层数组拷贝，切断和原数组的引用关联
    newArr[i] = [...newArr[i]]
    for(let j=0; j<newArr[i].length;j++) {
      newArr[i][j] = [newArr[i][j][1],newArr[i][j][0]]
    }
  }
  return newArr
}

2. 更简洁的链式map实现：

const doubleRound = arr => arr.map(
  secondLayer => secondLayer.map(
    innerArr => [innerArr[1], innerArr[0]]
  )
)

两种实现都不会修改原数组primera，返回的新数组就是你需要的结构。

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