JavaScript嵌套数组复制修改时全域变更问题求助

问题原因 #

你遇到的问题本质是JavaScript中数组属于引用类型，直接通过let newRow = x赋值时，并没有创建新的子数组，只是让newRow和x指向同一个内存地址的数组对象。所以修改newRow的元素时，原数组x的内容也会跟着变化。

解决方案 #

需要创建子数组的浅拷贝（因为你的子数组元素都是基本类型，浅拷贝足够），常用的实现方式有三种：

• 扩展运算符：[...x]
• slice()方法：x.slice()
• Array.from()方法：Array.from(x)

修改后的代码示例 #

let array = [['a','e1'],['b','b1']]

let result = []

for(let x of array){
    result.push(x);
    if(x[1]==='e1'){
        // 创建子数组的浅拷贝，而非直接引用原数组
        let newRow = [...x]; 
        newRow[1] = 'e2'
        result.push(newRow);
    }
}

console.log(result); // 输出：[['a','e1'],['a','e2'],['b','b1']]

修改后，newRow是一个独立的新数组对象，修改它的元素不会影响原数组x，最终就能得到你需要的结果。

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