43

我想更新一个看起来像这样的对象：

currentObject = {
    someValue : "value",
    myObject : {
        attribute1 : "foo",
        attribute2 : "bar"
    }
};

..使用包含一些更改的对象，即：

updateObject = {
    myObject : {
        attribute2 : "hello world"
    }
};

最后，我想更新 currentObject 以便：

currentObject.myObject.attribute2 == "hello world"

这也应该适用于其他对象。作为一种解决方案，我考虑过迭代对象并以某种方式处理命名空间。但我想知道使用 jQuery 或原型之类的库是否有一个简单的解决方案来解决这个问题。

4

4 回答 4

23

我建议使用 underscore.js（或者更好的 lo-dash）extend：

_.extend（目的地，*来源）

将源对象中的所有属性复制到目标对象，然后返回目标对象。它是有序的，因此最后一个源将覆盖先前参数中的同名属性。

_.extend({name: 'moe'}, {age: 50});
=> {name: 'moe', age: 50}
于 2014-02-27T14:27:11.513 回答
12 
function update(obj/*, …*/) {
    for (var i=1; i<arguments.length; i++) {
        for (var prop in arguments[i]) {
            var val = arguments[i][prop];
            if (typeof val == "object") // this also applies to arrays or null!
                update(obj[prop], val);
            else
                obj[prop] = val;
        }
    }
    return obj;
}

应该做的伎俩：update(currentObject, updateObject)。您可能想要添加一些类型检查，例如Object(obj) === obj仅使用真实对象扩展真实对象，对数组或hasOwnProperty测试使用正确的循环。

于 2012-09-21T16:23:31.880 回答
3

这是一个Object.keys递归示例：

// execute object update function
update(currentObject, updateObject)

// instantiate object update function
function update (targetObject, obj) {
  Object.keys(obj).forEach(function (key) {

    // delete property if set to undefined or null
    if ( undefined === obj[key] || null === obj[key] ) {
      delete targetObject[key]
    }

    // property value is object, so recurse
    else if ( 
        'object' === typeof obj[key] 
        && !Array.isArray(obj[key]) 
    ) {

      // target property not object, overwrite with empty object
      if ( 
        !('object' === typeof targetObject[key] 
        && !Array.isArray(targetObject[key])) 
      ) {
        targetObject[key] = {}
      }

      // recurse
      update(targetObject[key], obj[key])
    }

    // set target property to update property
    else {
      targetObject[key] = obj[key]
    }
  })
}

JSFiddle 演示（打开控制台）。

于 2016-03-16T02:08:19.467 回答
1

一个简单的实现看起来像这样。

function copyInto(target /*, source1, sourcen */) {
    if (!target || typeof target !== "object")
        target = {};

    if (arguments.length < 2)
        return target;

    for (var len = arguments.length - 1; len > 0; len--)
        cloneObject(arguments[len-1], arguments[len]);

    return target;
}

function cloneObject(target, source) {
    if (!source || !target || typeof source !== "object" || typeof target !== "object")
        throw new TypeError("Invalid argument");

    for (var p in source)
        if (source.hasOwnProperty(p))
            if (source[p] && typeof source[p] === "object")
                if (target[p] && typeof target[p] === "object")
                    cloneObject(target[p], source[p]);
                else
                    target[p] = source[p];
            else 
                target[p] = source[p];
}

这假定不应克隆任何继承的属性。它也不检查诸如 DOM 对象或盒装原语之类的东西。

我们需要反向迭代参数，以便从右到左完成复制。

然后我们创建一个单独的cloneObject函数来处理嵌套对象的递归复制，这种方式不会干扰原始对象参数的从右到左的复制。

它还确保初始目标是一个普通对象。

cloneObject如果将非对象传递给该函数，则该函数将引发错误。

于 2012-09-21T16:45:55.767 回答