理解并手写深拷贝函数

let obj1 = {　　　　
　　name: 'dog',
　　array: [1, 2, 3],
　　son: {
　　　　name: 'dogSon'
　　}
}
obj2 = obj1;
obj2.name = 'cat';
obj2.son.name = 'catSon';
console.log(obj1.name);　　　　 //cat
console.log(obj1.son.name);　　//catSon
console.log(obj2.name);　　　　 //cat
console.log(obj2.son.name);　　//catSon

相信大家都明白，因为对象的浅拷贝，修改obj2属性后，两个对象的值同时都被修改了。

不理解的小伙伴可以看下我之前写的 '从数据类型上理解深浅拷贝'。

除了调用已有方法，我们该如何手写自己的深拷贝呢？

我们的函数方法起名为cloneDeep，而拷贝肯定返回了一个新的对象newObj。

function cloneDeep(obj){
  return newObj;      
}

首先要判定拷贝是否是一个对象，如果不是还看它干嘛！直接return结束！

function cloneDeep(obj) {
  　// 判断要拷贝的是否为对象  
　　if (!obj instanceof Object) {
　　　　return;
　　}
　　return newObj;
}

对要拷贝的对象进行判断，对返回的newObj设定数据类型。

function cloneDeep(obj) {
　　if (!obj instanceof Object) {
　　　　return;
　　}
　　// 判断这个对象是否为数组
　　let newObj = obj instanceof Array ? [] : {};
　　return newObj;
}

把对象进行遍历，然后开始进行拷贝。

function cloneDeep(obj) {
　　if (!obj instanceof Object) {
　　　　return;
　　}
　　let newObj = obj instanceof Array ? [] : {};
　　// 通过for...in遍历对象
　　for (let key in obj) {
　　　　newObj[key] = obj[key];
　　}
　　return newObj;
}

如果此时执行代码进行验证，我们会发现，目前完成的仅仅是第一层对象的拷贝。

console.log(obj1.name);　　　　 //dog
console.log(obj1.son.name);　　//catSon
console.log(obj2.name);　　　　 //cat
console.log(obj2.son.name);　　//catSon

因此可以先判断拷贝的属性是否还是一个对象，进行深层次的递归。

function cloneDeep(obj) {
　　if (!obj instanceof Object) {
　　　　return;
　　}
　　let newObj = obj instanceof Array ? [] : {};
　　for (let key in obj) {
　　　　// 如果对象的属性还是对象，就进行递归处理
　　　　newObj[key] = obj[key] instanceof Object ? cloneDeep(obj[key]) : obj[key];
　　}
　　return newObj;
}

这样我们的深拷贝就基本功能就完成了，不过缺点就是for in连带对象原型上的属性一起遍历了。

function cloneDeep(obj) {
　　if (!obj instanceof Object) {
　　　　return;
　　}
　　let newObj = obj instanceof Array ? [] : {};
　　for (let key in obj) {
　　　　// 使用 .hasOwnProperty()判断一个对象是否包含自定义属性而不是原型链上的属性
　　　　if (obj.hasOwnProperty(key)) {
　　　　　　newObj[key] = obj[key] instanceof Object ? cloneDeep(obj[key]) : obj[key];
　　　　}
　　}
　　return newObj;
}

最后来验证是否达到深拷贝的功能要求。

function cloneDeep(obj) {
　　if (!obj instanceof Object) {
　　　　return;
　　}
　　let newObj = obj instanceof Array ? [] : {};
　　for (let key in obj) {
　　　　if (obj.hasOwnProperty(key)) {
　　　　　　newObj[key] = obj[key] instanceof Object ? cloneDeep(obj[key]) : obj[key];
　　　　}
　　}
　　return newObj;
}
let obj1 = {　　　　
　　name: 'dog',
　　array: [1, 2, 3],
　　son: {
　　　　name: 'dogSon'
　　}
}
obj2 = obj1;
obj2.name = 'cat';
obj2.son.name = 'catSon';
console.log(obj1.name);　　　　 //dog
console.log(obj1.son.name);　　//dogSon
console.log(obj2.name);　　　　 //cat
console.log(obj2.son.name);　　//catSon

理解并手写深拷贝函数

推荐阅读