利用巧妙技巧，避免 JavaScript 变量指向同一内存区域

2023-10-09 15:48:39

在 JavaScript 中掌握引用类型：避免变量污染

在 JavaScript 的奇妙世界里，数据类型是不可或缺的概念，它决定了数据的特性和行为。理解各种数据类型之间的差异，尤其是引用类型，对于编写健壮高效的代码至关重要。

引用类型，比如数组和对象，就像租赁公寓的钥匙，指向同一块内存地址。这意味着对引用类型数据的任何改动都会同时影响原始数据，这在某些情况下可能会令人意外，甚至有害。

让我们用一个例子来说明：

// 创建一个数组
const myArray = [1, 2, 3];

// 使用引用传递将 myArray 复制到 newMyArray
const newMyArray = myArray;

// 修改 newMyArray 的值
newMyArray[0] = 4;

// 查看 myArray，它也受到了影响
console.log(myArray); // 输出：[4, 2, 3]

正如你所看到的，由于引用传递，对 newMyArray 的修改也影响了原始数组 myArray。为了避免这种意外污染，我们需要一些技巧来让变量指向不同的内存区域。

对于数组，我们可以使用 [].concat() 方法：

// 创建一个数组
const myArray = [1, 2, 3];

// 使用 [].concat() 复制 myArray
const newMyArray = [].concat(myArray);

// 修改 newMyArray 的值
newMyArray[0] = 4;

// 查看 myArray，它没有受到影响
console.log(myArray); // 输出：[1, 2, 3]

[].concat() 方法就像一个复制机，它会生成一个包含原始数组所有元素的新数组，但不会指向同一块内存地址。

对于对象，我们可以使用 JSON.stringify() 和 JSON.parse() 方法：

// 创建一个对象
const myObject = { name: "John", age: 30 };

// 使用 JSON.stringify() 和 JSON.parse() 复制 myObject
const newMyObject = JSON.parse(JSON.stringify(myObject));

// 修改 newMyObject 的值
newMyObject.name = "Jane";

// 查看 myObject，它没有受到影响
console.log(myObject); // 输出：{ name: "John", age: 30 }