Cloning A JavaScript Object - Including Getters and Setters

一个人想着一个人 提交于 2019-12-07 09:21:06

问题


In a project I'm working on, I'm having to clone a object to a variable.
I first tried - what seemed to be the most obvious solution - to do var obj2 = obj1, however I soon realized this makes obj2 refer to obj1, so whenever I set a property in obj2, the property is updated in obj1, too. Well, I can't have that. So, I started searching around for ways to clone a object in JavaScript - I found multiple solutions for this, mainly
var obj2 = JSON.parse(JSON.stringify(obj1)) - but that didn't keep all getters and setters I had defined for my object!
The now most obvious solution to me seems to firstly use the JSON trick above to make obj2 have all of obj1's properties, then loop through all of the objects getters and setters and add them back using Object.defineProperty(), but I have yet to find a way to get all getters/setters of an object.


回答1:


At a practical level it's impossible to 100% accurately clone an object since the getters and setters (and indeed other functions) may be accessing lexically-scoped private variables via closures. Accessing such a method will reference the original object, not the clone.

If (and only if) that's not the case, you can just enumerate over all properties (even non-enumerable ones) found via Object.getOwnPropertyNames() and then for each name simply obtain the individual PropertyDescriptors with Object.getOwnPropertyDescriptor and then pass the resulting field to Object.defineProperty, e.g.:

function shallowClone(obj) {
    var clone = Object.create(Object.getPrototypeOf(obj));

    var props = Object.getOwnPropertyNames(obj);
    props.forEach(function(key) {
        var desc = Object.getOwnPropertyDescriptor(obj, key);
        Object.defineProperty(clone, key, desc);
    });

    return clone;
}

In ES2017 you can do this instead:

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



回答2:


by @Alnitak, I thinks that is shortcut way

function shallowClone(obj){
 var clone = Object.create(Object.getPrototypeOf(obj));
 var descriptors = Object.getOwnPropertyDescriptors(obj);
 Object.defineProperties(clone, descriptors);
 return clone;
}


来源:https://stackoverflow.com/questions/34480936/cloning-a-javascript-object-including-getters-and-setters

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!