好好理解深浅拷贝和赋值(针对引用类型)
赋值:两个对象指向同一内存地址。结果,无论是修改基本类型还是引用类型,两个对象的值都会改变。
浅拷贝:两个对象指向不同的内存地址,但是他们中的引用类型数据指向同一内存地址。结果,修改引用类型,两个对象的值都会改变;修改基本类型,互不影响。
深拷贝:两个对象指向不同的内存地址,他们中的引用类型也指向不同的内存地址。结果,均互不影响。
直接通过Object.assign()实现浅拷贝
浅拷贝:
1const target = { 2 a: 1, 3 b: 2 , 4 c:[1,2], 5 d:function() { 6 console.log(this.d) 7 } 8}; 9let newObj = Object.assign({},target); 10newObj.a = 3 11newObj.c[1] = 3 12console.log('newObj',newObj) 13console.log('target',target)
手写深浅拷贝:
浅拷贝:
1let target = { a: 1, b: 2 ,c:[1,2],d:function() { 2 console.log(this.d) 3}}; 4//let cc = Object.assign({},target); 5let cc = shallowClone(target); 6cc.c[1] = 4 7console.log('cc',cc) 8console.log('target',target) 9function shallowClone(obj) { 10 let newObj = new Object() 11 for (const key in obj) { 12 if (Object.hasOwnProperty.call(obj, key)) { 13 newObj[key] = obj[key]; 14 } 15 } 16 return newObj 17}
深拷贝:
1let target = { a: 1, b: 2 ,c:[1,2],d:function() { 2 console.log(this.d) 3}}; 4let cc = deepClone(target); 5cc.c[1] = 4 6console.log('cc',cc) 7console.log('target',target) 8function deepClone(obj) { 9 let type = Object.prototype.toString.call(obj) 10 console.log(type) 11 if(type.indexOf('Object') === -1){ 12 return obj 13 }else{ 14 let newObj = new Object() 15 for (const key in obj) { 16 if (Object.hasOwnProperty.call(obj, key)) { 17 newObj[key] = deepClone(obj[key]); 18 } 19 } 20 return newObj 21 } 22}
