js中的cloneDeep是什么？
`cloneDeep` 是 JavaScript 中用于进行**深拷贝**（deep clone）的一种方法，它会递归地复制一个对象或数组中的所有嵌套属性。深拷贝与浅拷贝（shallow copy）不同，深拷贝会完整复制对象的所有层级，包括嵌套的对象或数组，而浅拷贝只复制最外层的引用。
在 JavaScript 中，原始数据类型（如字符串、数字、布尔值等）拷贝时会直接复制其值，而对于对象或数组这样的复杂类型，默认情况下只复制其引用。因此，修改浅拷贝后的对象会影响原始对象。而深拷贝能确保完全独立的复制，即使修改拷贝后的对象，也不会影响原始对象。
### `cloneDeep` 的功能：
1. **深度复制**：递归地拷贝对象或数组，保证所有嵌套结构都被完整复制。
2. **独立性**：拷贝的结果与原始对象完全独立，修改新对象不会影响原对象。
### 常见用法：
`cloneDeep` 通常可以在库如 Lodash 中找到，也可以通过自定义实现。下面是使用 Lodash 库中的 `cloneDeep` 的例子：#### Lodash 的 `cloneDeep` 示例：
// 先引入 Lodash 库
const _ = require('lodash');
// 定义一个对象
const obj = {
name: 'Alice',
age: 25,
skills: ['JavaScript', 'React'],
address: {
city: 'New York',
zip: 10001
}
};
// 使用 cloneDeep 进行深拷贝
const clonedObj = _.cloneDeep(obj);
// 修改深拷贝后的对象
clonedObj.name = 'Bob';
clonedObj.address.city = 'Los Angeles';
// 原始对象不受影响
console.log(obj.name); // 'Alice'
console.log(obj.address.city); // 'New York'
console.log(clonedObj.name); // 'Bob'
console.log(clonedObj.address.city); // 'Los Angeles'
### 浅拷贝 vs 深拷贝
- **浅拷贝**（如使用 `Object.assign` 或展开运算符 `...`）只会复制对象的第一层，嵌套的对象仍然是原对象的引用。
- **深拷贝**：将对象的所有层级都复制出来，确保拷贝后的对象与原对象彻底分离。#### 浅拷贝示例：
const obj = { name: 'Alice', address: { city: 'New York' } };
const shallowCopy = { ...obj };
shallowCopy.name = 'Bob'; // 修改浅拷贝后的值
shallowCopy.address.city = 'LA'; // 修改嵌套对象的值
console.log(obj.address.city); // 'LA' -> 原始对象的嵌套属性也被修改了
#### 深拷贝示例（手动实现）：
如果没有使用 Lodash 或类似的库，可以手动实现深拷贝。最简单的方式是使用 `JSON.stringify` 和 `JSON.parse`，但这种方法只适用于对象属性是简单数据类型的情况，不支持 `Date`、`Function`、`undefined`、`Symbol` 等特殊类型：
const obj = { name: 'Alice', address: { city: 'New York' } };
const deepCopy = JSON.parse(JSON.stringify(obj));
deepCopy.address.city = 'Los Angeles';
console.log(obj.address.city); // 'New York' -> 原始对象没有被修改
### 总结：
- `cloneDeep` 是一种用于深度复制对象或数组的函数，可以确保复制后的对象与原对象完全独立。
- 它可以防止嵌套对象或数组在拷贝后相互影响，常用于避免数据的意外篡改或共享状态问题。
- 在实际项目中，`cloneDeep` 常来自于工具库（如 Lodash），也可以手动实现，但需要考虑复杂对象的特殊情况。
原文地址：https://blog.csdn.net/xiaohua0708day/article/details/142501954
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！