前 言
面试中经常被问到JS中的深度克隆, 在写代码中也会用到对象的深度克隆这个需求.
故将我能想到的方法都整理出来, 供大家参考.
请大家不啬赐教.
现有一个源对象 sourceObj 供拷贝, 如下:
const sourceObj = {
name: 'Alex',
house: ["深圳湾一号", "江南别野"],
more: {
money: "1000000000000",
carCount: "5",
bank: {
bank1: "中国工商银行",
bank2: "中国银行",
sayHi2: function () {
alert("我是sayHi2函数")
},
bank3: {
name1: "浦发银行",
name2: "兴业银行"
}
}
},
sayHi: function (op) {
alert(op + ": " + "你好, 我是 " + this.name)
console.log(this) // 打印一下对象本身
}
}
方法一: 使用递归遍历对象的属性
该函数传入source对象, 返回一个clone后的新对象
function deepClone(origin, target) {
//target是否存在如果不存在创建空对象
let tar = target || {},
//判断是否为引用数据类型
toStr = Object.prototype.toString,
arrType = '[object Array]';
for (let key in origin) {
//剥离原型链的数据
if (origin.hasOwnProperty(key)) {
//判断是否为引用数据类型 对象或数组
if (typeof (origin[key]) === 'object' && origin[key] !== null) {
if (toStr.call(origin[key]) === arrType) {
tar[key] = [];
} else {
tar[key] = {};
}
deepClone(origin[key], tar[key]);
} else {
tar[key] = origin[key];
}
}
}
return tar;
}
现在将递归函数进行校验
console.log("克隆后的新对象为", deepClone(sourceObj))
deepClone(sourceObj).more.bank.sayHi2() // "我是sayHi2函数"
[完]