1.区别
赋值： 基本数据直接拷贝，互不影响，引用数据把地址赋值给新对象，新旧对象指向同一个地址。
浅拷贝: 基本类型之间互不影响，对象只会复制对象的第一层基本数据和引用类型的地址，对象内部嵌套的引用类型会共享内存地址。所以，浅拷贝对象的第一层数据是互相不影响的，但是内部嵌套的引用类型会共享内存地址
深拷贝: 基本数据和对象都互不影响。改变新对象不会影响旧对象，新旧对象互不影响。
2.详解
1-赋值
赋值操作（简称赋值）：赋值操作符 = ****右边的表达式会先被求值，然后将结果赋给左边的变量或属性。
基本数据直接拷贝，互不影响，引用数据把地址赋值给新对象，新旧对象指向同一个地址。
// 赋值给变量
let a = 1;
let b = a;
a = 2;
b = 3;
console.log(a, b); // 2 3 ->基本数据互不影响
// 赋值对象
const obj = { a: 1 };
const obj1 = obj;
obj.b = 0;
obj1.b = 1;
console.log(obj.b, obj1.b); // 对象把地址赋值给新对象，新旧对象指向同一个地址
2-浅拷贝
拷贝是创建一个新对象，这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型，拷贝的就是基本类型的值，如果属性是引用类型，拷贝的就是内存地址 。
浅拷贝方法
- concat(）
- slice()
- 扩展运算符
const obj1 = {
name: "zbt",
age: 18,
dog: {
name: "旺财",
age: 3
}
}
// Object.assign()方法
const objAssign = Object.assign({}, obj1);
objAssign.dog.name = "assign";
obj1.name = "法外狂徒";
objAssign.name = "张三";
console.log(obj1.name, objAssign.name); // 法外狂徒 张三 基本数据类型精确拷贝，互不影响
console.log(obj1.dog.name, objAssign.dog.name); //assign assign 内存引用数据拷贝的是内存地址，数据共享，互相影响。
// 扩展运算符方法
const objExtend = { ...obj1 }
objExtend.dog.name = "extend";
obj1.name = "出道两年半";
objExtend.name = "哥哥";
console.log(obj1.name, objExtend.name); // 出道两年半 哥哥 基本数据类型互不影响
console.log(obj1.dog.name, objExtend.dog.name); // extend extend 同理
3-深拷贝
深拷贝是将一个对象从内存中完整的拷贝一份出来,从堆内存中开辟一个新的区域存放新对象, 故新旧数据互不影响。
// 1.直接stringify + parse
const a = {};
const b = JSON.parse(JSON.stringify(a));
// 2.直接使用回调函数。
//使用递归的方式实现数组、对象的深拷贝
function deepClone(obj) {
//判断拷贝的要进行深拷贝的是数组还是对象，是数组的话进行数组拷贝，对象的话进行对象拷贝
var objClone = Array.isArray(obj) ? [] : {};
//进行深拷贝的不能为空，并且是对象或数组
if (obj && typeof obj === "object") {
for (key in obj) {
if (obj.hasOwnProperty(key)) { // 过滤掉原型链上继承的对象属性,for in 不能遍历出非可枚举属性
if (obj[key] && typeof obj[key] === "object") { // obj[key]->用来判断null,undefined
objClone[key] = deepClone(obj[key]);
} else {
objClone[key] = obj[key];
}
}
}
}
return objClone;
}
let obj1 = { name: '张三', action: { say: 'hi'},'': undefined }
obj1[Symbol(66)] = 999;
console.log(obj1);
let newObj = deepClone(obj1)
console.log(newObj);
3-扩展
stringify深拷贝和循环回调深拷贝的对比。
对象在stringify在拷贝过程中，以下几种情况需要注意：
- 对象中有undefined类型或function类型的数据时 --- undefined和function会直接丢失。
- 对象中有NaN、Infinity和-Infinity这三种值的时候 --- 会变成null。
- 对象允许嵌套任意深度，但是不能构成引用循环,否则stringify会抛出错误。
const obj = {
name:"我是一个外部对象"
}
const oldObj = {
name:"BUG海",
notDefined:undefined,
foo(){
console.log("我会被stringfy哥哥丢掉嘛"); //真会丢
},
one:NaN,
two:Infinity,
three:-Infinity,
};
// oldObj.objInterior = oldObj; //加上这个引用循环stringify,真的会抛出错误
const newObj = JSON.parse(JSON.stringify(oldObj));
console.log("🚀 ~ file: test.js:12 ~ newObj:", newObj)
所以推荐使用递归的方式进行深拷贝或者第三方工具库的方式 immutale，Lodash ，fast-copy等。 本文正在参加「金石计划」
