我们在书写JS的时候常常被一种现象困扰
let jsonA = {
a1: {
b1:1;
},
};
let jsonB = jsonA;
jsonB.a1.b1 = 2;
console.log(jsonA.a1.b1) // 此时输出2；
又或者
let jsonA = {
a1: {
b1: 1
}
};
let jsonB = {
a1: {
c1: 1
}
};
let jsonC = Object.assign(jsonA, jsonB);
console.log(JSON.stringify(jsonC)); // 输出 {"a1":{"c1":1}}
啦啦啦，b1不见了！
这是因为引用类型的关系，值类型和引用类型的区别请自行查询，这里就不赘述了。
那要如何解决呢？
一、实现深层拷贝
/**
* 实现json对象的深层拷贝
* @parent 需要拷贝的原对象
* @child 返回的拷贝完成的对象(参数可省略)
*/
function copyDeeply (parent, child) {
child = child || {};
for (var prop in parent) {
// 如果属性本身,就是一个数组或者Json对象,进行深拷贝
if (typeof parent[prop] === 'object') {
// 确定子对象的属性类型,[]或者{}对象
child[prop] = (parent[prop].constructor === Array) ? [] : {};
// 实现深拷贝
copyDeeply(parent[prop], child[prop]);
} else {
child[prop] = parent[prop];
}
}
return child;
}
二、实现深层继承
/**
* 实现json对象的深层继承
* @parent 被继承原对象
* @child 继承对象(把child对象继承到parent)
* @result 最终生成的结果对象(参数可省略)
*/
function extendDeeply (parent, child, result) {
result = result || copyDeeply(parent);
for (var prop in child) {
// 如果属性本身,就是一个数组或者Json对象,进行深拷贝
if (child[prop].constructor === Object) {
result[prop] = result[prop] || {};
// 实现深拷贝
extendDeeply(parent[prop], child[prop], result[prop]);
} else {
result[prop] = child[prop];
}
}
return result;
}
这样就可以解决上面所述的问题了
本文章持续更新中。。。