原生JS实现对象属性的克隆。
浅层克隆
实现步骤如下:
1.判断是不是原型链上的属性
2.属性的克隆
function clone(origin, target) {
var target = target || {};
for(var prop in origin) {
if (origin.hasOwnProperty(prop)) {
target[prop] = origin[prop];
}
}
}
var obj = {
A : 'a',
B : ['c', 'd']
};
var obj1 = {};
clone(obj, obj1);
//结果如下:
//clone(obj, obj1);
//obj.B
//(2) ["c", "d"];
//obj.B.push('e');
//obj.B
//(3) ["c", "d", "e"]
//obj1.B
//(3) ["c", "d", "e"]
可以发现,浅层克隆obj和obj1的属性值同时改变,为解决这一问题使用深层克隆。
深层克隆的实现
实现步骤如下:
1.判断是不是原型链上的属性
2.判断是不是原始值
3.判断是数组还是对象(不考虑方法)
4.建立相应的数组或对象
5.递归
function deepClone(origin, target) {
var target = target || {},
toStr = Object.prototype.toString,
arrStr = '[object Array]';
for(var prop in origin) {
//非原型链上属性
if (origin.hasOwnProperty(prop)) {
//引用值
if (origin[prop] !== 'null' && typeof(origin[prop]) == 'object') {
//判断是数组还是对象
target[prop] = (toStr.call(origin[prop]) == arrStr) ?
[] : {};
//递归
deepClone(origin[prop], target[prop]);
} else {
//原始值
target[prop] = origin[prop];
}
}
}
}