一般不会深拷贝函数等,所以一般用递归和JSON方法即可。
如果要实现函数等拷贝,比较完美的做法:
function deepClone(data) {
const type = this.judgeType(data);
let obj;
if (type === 'array') {
obj = [];
} else if (type === 'object') {
obj = {};
} else {
// 不再具有下一层次
return data;
}
if (type === 'array') {
// eslint-disable-next-line
for (let i = 0, len = data.length; i < len; i++) {
obj.push(this.deepClone(data[i]));
}
} else if (type === 'object') {
// 对原型上的方法也拷贝了....
// eslint-disable-next-line
for (const key in data) {
obj[key] = this.deepClone(data[key]);
}
}
return obj;
},
function judgeType(obj) {
// tostring会返回对应不同的标签的构造函数
const toString = Object.prototype.toString;
const map = {
'[object Boolean]': 'boolean',
'[object Number]': 'number',
'[object String]': 'string',
'[object Function]': 'function',
'[object Array]': 'array',
'[object Date]': 'date',
'[object RegExp]': 'regExp',
'[object Undefined]': 'undefined',
'[object Null]': 'null',
'[object Object]': 'object',
};
if (obj instanceof Element) {
return 'element';
}
return map[toString.call(obj)];
}
递归:
// 递归的方法实现深拷贝,实际是深入到对象内层不为对象的属性值,然后一个接一个地开辟新的内存地址.
var json1={"name":"鹏哥","age":18,"arr1":[1,2,3,4,5],"string":'afasfsafa',"arr2":[1,2,3,4,5],"arr3":[{"name1":"李鹏"},{"job":"前端开发"}]};
var json2={};
function copy(obj1,obj2){
var obj2 = obj2 || {}; // 最初的时候给它一个初始值等于它自己或者是一个json
for (var name in obj1) {
if (typeof obj1[name] === 'object') { // 先判断一下obj1[name]是不是一个对象
obj2[name] = (obj1[name].constructor === Array)? [] : {}, // 区分对象或者数组
copy(obj1[name],obj2[name]) // 调用自身
} else {
obj2[name] = obj1[name] // 如果不是对象,直接等于即可,不会发生引用
}
}
return obj2; // 然后再把复制好的对象给return出去
}
json2 = copy(json1,json2)
json2.arr1.push(24)
console.log(json1)
console.log(json2)
JSON:
// JSON.parse和JSON.stringify也可以实现深拷贝,但是有一定的限制.对于函数或者内置方法或者构造函数等会出现问题
var a = {
a:{
i:1,
k:[1,2,3]
},
b:[{a:123}]
}
function deepCopy(initalObject){
var finalObject = {}
finalObject = JSON.parse(JSON.stringify(initalObject))
return finalObject
}
var b = deepCopy(a);
b.a.k[0]= 33
b.b[0]['a'] = 321123
console.log(a)
console.log(b)
参考链接:
//www.greatytc.com/p/0d7bd31ccf43 js中对象的复制,浅复制(浅拷贝)和深复制(深拷贝)
//www.greatytc.com/p/b084dfaad501 关于JSON.parse(JSON.stringify(obj))实现深拷贝应该注意的坑