JavaScript 中，不同的赋值方式适用场景

在 JavaScript 中，不同的赋值方式适用于不同的场景。以下是每种赋值方式的详细解释和使用场景：

1. 使用扩展运算符 ... 进行浅拷贝

let obj = { ...data };

• 功能：创建一个新的对象，并将 data 对象的所有可枚举属性复制到新对象中。
• 适用场景：适用于简单对象的浅拷贝，特别是当对象的属性不包含嵌套对象或数组时。

示例：

let data = { a: 1, b: 2 };
let obj = { ...data };
console.log(obj); // { a: 1, b: 2 }

2. 使用 JSON.parse(JSON.stringify(obj)) 进行深拷贝

let newObj = JSON.parse(JSON.stringify(obj));

• 功能：创建一个新的对象，并将 obj 对象及其嵌套对象和数组进行深拷贝。
• 适用场景：适用于需要深拷贝的场景，特别是当对象包含嵌套对象或数组时。
• 限制：无法处理函数、undefined、NaN、Infinity、Date 对象（会转换为 ISO 字符串）、RegExp 对象（会转换为空对象）、Error 对象（会转换为空对象）等。

示例：

let data = { a: 1, b: { c: 2 } };
let newObj = JSON.parse(JSON.stringify(data));
console.log(newObj); // { a: 1, b: { c: 2 } }

3. 使用 Object.assign() 进行浅拷贝

Object.assign(formData, row);

• 功能：将 row 对象的所有可枚举属性复制到 formData 对象中。如果 formData 和 row 有相同的属性，row 中的属性值会覆盖 formData 中的属性值。
• 适用场景：适用于需要合并对象属性的场景，特别是当需要保留目标对象的引用时。

示例：

let formData = { a: 1, b: 2 };
let row = { b: 3, c: 4 };
Object.assign(formData, row);
console.log(formData); // { a: 1, b: 3, c: 4 }

4. 使用数组的扩展运算符 ... 进行浅拷贝

stateTable.table.data = [...data];

• 功能：创建一个新的数组，并将 data 数组的所有元素复制到新数组中。
• 适用场景：适用于需要浅拷贝数组的场景，特别是当数组的元素不包含嵌套对象或数组时。

示例：

let data = [1, 2, 3];
let newData = [...data];
console.log(newData); // [1, 2, 3]

总结

• ... 扩展运算符：适用于简单对象或数组的浅拷贝。
• JSON.parse(JSON.stringify(obj))：适用于需要深拷贝的场景，特别是当对象包含嵌套对象或数组时。
• Object.assign()：适用于需要合并对象属性的场景，特别是当需要保留目标对象的引用时。