如何在保留getter / setter的同时浅层复制Javascript对象?

时间:2017-04-21 00:17:56

标签: javascript

背景(为什么Object.update()jQuery.extend()不是解决方案,为什么这不是其他如何复制-javascript-object问题的副本): 此版本的副本,使用for-loop

function copy_obj(obj) {
    var copy = {};
    for (var attr in obj) if (obj.hasOwnProperty(attr)) {
        copy[attr] = obj[attr];
    }
    return copy;
}

仅复制属性的值(与Object.update()一样),并在以下对象上失败:

var myobj = {
    _fname: 'fname',
    _lname: 'lname',
    get fullname() { return this._fname + ' ' + this._lname; },
    set fullname(v) { this._fname = v; }
};

myobj.fullname === 'fname lname'  // true
myobj.fullname = 'Anton'
myobj.fullname === 'Anton lname'  // true

,而

var mycopy = copy_obj(myobj);
mycopy.fullname === 'fname lname'  // true
mycopy.fullname = 'Anton'
mycopy.fullname === 'Anton'  // oops!

问题:我已经发现我需要使用getOwnPropertyNames / Descriptor来获取/设置描述符,但我还没有找到任何简单的方法来确定某些东西是否只是一个可以直接复制的普通值 - 什么进入if语句:

function copy_obj2(obj) {
    var mycopy = {};
    Object.getOwnPropertyNames(obj).forEach(function (prop) {
        var descriptor = Object.getOwnPropertyDescriptor(obj, prop);
        if (/* descriptor is a plain value */) {
            mycopy[prop] = obj[prop];
        } else {
            Object.defineProperty(mycopy, prop, descriptor);
        }
    });
    return mycopy;
}

(我只对复制类似对象的值感兴趣,而不是Arrays或其他基本类型。)

1 个答案:

答案 0 :(得分:2)

您无需担心描述符的类型;无论是数据类型描述符还是访问器类型描述符,您都可以按原样使用它来在目标对象上创建属性。

function copy_obj2(obj) {
    var mycopy = {};
    Object.getOwnPropertyNames(obj).forEach(function (prop) {
        var descriptor = Object.getOwnPropertyDescriptor(obj, prop);
        Object.defineProperty(mycopy, prop, descriptor);
    });
    return mycopy;
}

但您也可以getOwnPropertyDescriptors使用defineProperties

function copy_obj2(obj) {
  return Object.defineProperties({}, Object.getOwnPropertyDescriptors(obj));
}

如果您还想将原型包含在克隆中,那么:

function copy_obj2(obj) {
  return Object.create(Object.getPrototypeOf(obj),  Object.getOwnPropertyDescriptors(obj));
}

但是,getOwnPropertyDescriptors在IE中不可用。建议使用填充物here