js 数组直接赋值

在JavaScript中，数组的直接赋值通常指的是将一个数组变量赋值给另一个变量，或者将一个数组作为参数传递给函数。这里有一些基础概念和相关细节：

基础概念

1. 引用传递：在JavaScript中，数组是对象，因此当数组被赋值给另一个变量或传递给函数时，实际上是将数组的引用（内存地址）传递给了新的变量或函数参数，而不是复制整个数组。

相关优势

• 内存效率：由于传递的是引用，而不是副本，因此可以节省内存。
• 性能：避免了复制大型数组时的性能开销。

类型

• 浅拷贝：直接赋值会导致两个变量引用同一个数组对象，修改其中一个会影响另一个。
• 深拷贝：如果需要完全独立的数组副本，可以使用深拷贝方法，如JSON.parse(JSON.stringify(array))，或者使用库函数如Lodash的_.cloneDeep。

应用场景

• 共享数据：当需要在多个地方共享同一个数组数据时，可以直接赋值。
• 函数参数：在函数间传递数组时，通常使用直接赋值。

遇到的问题及原因

问题：修改一个数组变量会影响另一个变量。

原因：因为两个变量引用的是同一个数组对象。

解决方法：

• 使用slice()方法：let newArray = oldArray.slice();
• 使用扩展运算符：let newArray = [...oldArray];
• 使用Array.from()方法：let newArray = Array.from(oldArray);
• 深拷贝：对于包含嵌套对象的数组，可以使用JSON.parse(JSON.stringify(oldArray));或者Lodash的_.cloneDeep(oldArray);

示例代码

// 直接赋值
let arr1 = [1, 2, 3];
let arr2 = arr1;
arr2[0] = 99;
console.log(arr1); // 输出: [99, 2, 3]

// 使用slice()方法避免影响原数组
let arr3 = [1, 2, 3];
let arr4 = arr3.slice();
arr4[0] = 99;
console.log(arr3); // 输出: [1, 2, 3]

// 使用扩展运算符避免影响原数组
let arr5 = [1, 2, 3];
let arr6 = [...arr5];
arr6[0] = 99;
console.log(arr5); // 输出: [1, 2, 3]

// 使用深拷贝避免影响原数组（对于嵌套数组）
let arr7 = [{ a: 1 }, { b: 2 }];
let arr8 = JSON.parse(JSON.stringify(arr7));
arr8[0].a = 99;
console.log(arr7); // 输出: [{ a: 1 }, { b: 2 }]

通过上述方法，可以根据不同的需求选择合适的数组复制方式，以避免不必要的副作用。