仔细看看,会有收获。js深浅拷贝
Posted 小小码农,可笑可笑
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了仔细看看,会有收获。js深浅拷贝相关的知识,希望对你有一定的参考价值。
好好理解深浅拷贝和赋值(针对引用类型)
赋值:两个对象指向同一内存地址。结果,无论是修改基本类型还是引用类型,两个对象的值都会改变。
浅拷贝:两个对象指向不同的内存地址,但是他们中的引用类型数据指向同一内存地址。结果,修改引用类型,两个对象的值都会改变;修改基本类型,互不影响。
深拷贝:两个对象指向不同的内存地址,他们中的引用类型也指向不同的内存地址。结果,均互不影响。
直接通过Object.assign()实现浅拷贝
浅拷贝:
const target =
a: 1,
b: 2 ,
c:[1,2],
d:function()
console.log(this.d)
;
let newObj = Object.assign(,target);
newObj.a = 3
newObj.c[1] = 3
console.log('newObj',newObj)
console.log('target',target)
手写深浅拷贝:
浅拷贝:
let target = a: 1, b: 2 ,c:[1,2],d:function()
console.log(this.d)
;
//let cc = Object.assign(,target);
let cc = shallowClone(target);
cc.c[1] = 4
console.log('cc',cc)
console.log('target',target)
function shallowClone(obj)
let newObj = new Object()
for (const key in obj)
if (Object.hasOwnProperty.call(obj, key))
newObj[key] = obj[key];
return newObj
深拷贝:
let target = a: 1, b: 2 ,c:[1,2],d:function()
console.log(this.d)
;
let cc = deepClone(target);
cc.c[1] = 4
console.log('cc',cc)
console.log('target',target)
function deepClone(obj)
let type = Object.prototype.toString.call(obj)
console.log(type)
if(type.indexOf('Object') === -1)
return obj
else
let newObj = new Object()
for (const key in obj)
if (Object.hasOwnProperty.call(obj, key))
newObj[key] = deepClone(obj[key]);
return newObj
以上是关于仔细看看,会有收获。js深浅拷贝的主要内容,如果未能解决你的问题,请参考以下文章