浅拷贝:只拷贝对象的基础属性值,两个对象指向同一个内存地址。
深拷贝:拷贝对象的所有属性作为一个全新的对象。两个对象指向不同内存地址。
浅拷贝仅仅是指向被复制的内存地址,如果原地址中对象被改变了,那么浅拷贝出来的对象也会相应改变。
一.浅拷贝
使用Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。
var obj = {
x:18
}
var newObj = Object.assion({},obj);
console.log(newObj===obj);//true
newObj.x = 20;
console.log(obj.y)//20
理解:上述代码将原始对象拷贝到一个空对象,就得到原始对象的克隆,原对象和拷贝对象指向不同的内存地址,修改原对象和克隆对象,互不影响。
var obj = {
x:18,
y:{
a:10
}
}
var newObj = Object.assign({}, obj);
console.log(newObj === obj);//false
newObj.y.x = 20;
理解:上述代码将原始对象拷贝到一个空对象,就得到原始对象的克隆。因为Object.assign()只是浅拷贝newObj.y是对栈对象的引用,因此内层对象的修改会影响原始对象。
拓展运算符
var obj = {
x:{
y:10
}
}
var newObj = {...obj};
newObj.x.y = 20;
console.log(obj.x.y)//20
二.深拷贝
1. JSON.parse()和JSON.stringify()
可以通过JSON对象的方法,来进行对象的深拷贝,代码如下:
//利用json两个api进行深拷贝
function deepClone(obj){
return JSON.parse(JSON.Stringify(obj));
}
理解:通过对象符串化和字符串对象化进行对象的拷贝。此方法只使用与纯JSON对象的深拷贝
2.递归遍历
function deepClone(obj){
if(obj===null) return null;
if(typeof obj!=='object') return obj;
let newObj = Array.isArray(obj)?[]:{};
for(let key in obj){
if(obj.hasOwnProperty(key)){
newObj[key] = typeof obj[key] === 'object' ? arguments.callee(obj[key]) : obj[key];
}
}
return newObj;
}
理解:
(1)、用obj.hasOwnProperty(key)来判断属性是否来自原型链上,因为for…in…也会遍历其原型链上的可枚举属性。
(2)、函数用到递归算法,在函数有名字,而且名字以后也不会变的情况下,这样定义没有问题。但问题是这个函数的执行与函数名 factorial 紧紧耦合在了一起。为了消除这种紧密耦合的现象,需要使用 arguments.callee。