在JavaScript中,对象(Object)是一个引用类型,它是指向内存中的一个位置,如果只是简单地将同一个内存地址指向两个JavaScript变量,不能实现对象复制的功能,因为只要修改其中一个变量,就可以修改内存上该地址的值。
对象的拷贝分为浅拷贝和深拷贝。
浅拷贝。如果你的对象的属性都是值类型,可以使用拓展运算符
或Object.assign
方法。需要知道的是,浅拷贝只是复制对象在内存中的位置,而不会产生新的内存地址。
var obj = { foo: "foo", bar: "bar" };
// 使用拓展运算符(...)
var copy = { ...obj }; // Object { foo: "foo", bar: "bar" }
// 使用Object.assign
var copy = Object.assign({}, obj); // Object { foo: "foo", bar: "bar" }
深拷贝。对象的深拷贝,最简单的方法就是使用JSON.stringify和JSON.parse,实现对象的中转转换。如果遇到更复杂的情况,需要使用HTML5的结构化复制。示例如下:
function deepClone(obj) {
var copy;
// Handle the 3 simple types, and null or undefined
if (null == obj || "object" != typeof obj) return obj;
// Handle Date
if (obj instanceof Date) {
copy = new Date();
copy.setTime(obj.getTime());
return copy;
}
// Handle Array
if (obj instanceof Array) {
copy = [];
for (var i = 0, len = obj.length; i < len; i++) {
copy[i] = deepClone(obj[i]);
}
return copy;
}
// Handle Function
if (obj instanceof Function) {
copy = function() {
return obj.apply(this, arguments);
}
return copy;
}
// Handle Object
if (obj instanceof Object) {
copy = {};
for (var attr in obj) {
if (obj.hasOwnProperty(attr))
copy[attr] = deepClone(obj[attr]);
}
return copy;
}
throw new Error("Unable to copy obj as type isn't supported " + obj.constructor.name);
}
希望这篇文字能给你启发,让你更好地理解JavaScript中的对象拷贝的方法。