如何动态合并两个JavaScript对象的属性？ [英] How can I merge properties of two JavaScript objects dynamically?

问题描述

我需要能够在运行时合并两个（非常简单的）JavaScript对象。例如，我想：

I need to be able to merge two (very simple) JavaScript objects at runtime. For example I'd like to:

var obj1 = { food: 'pizza', car: 'ford' }
var obj2 = { animal: 'dog' }

obj1.merge(obj2);

//obj1 now has three properties: food, car, and animal

有没有人有这样的脚本或知道内置的方法来做到这一点？我不需要递归，我不需要合并函数，只需要平面对象上的方法。

Does anyone have a script for this or know of a built in way to do this? I do not need recursion, and I do not need to merge functions, just methods on flat objects.

推荐答案

ECMAScript 2018年标准方法

您可以使用对象传播：

let merged = {...obj1, ...obj2};

/** There's no limit to the number of objects you can merge.
 *  Later properties overwrite earlier properties with the same name. */
const allRules = {...obj1, ...obj2, ...obj3};

ECMAScript 2015（ES6）标准方法

/* For the case in question, you would do: */
Object.assign(obj1, obj2);

/** There's no limit to the number of objects you can merge.
 *  All objects get merged into the first object. 
 *  Only the object in the first argument is mutated and returned.
 *  Later properties overwrite earlier properties with the same name. */
const allRules = Object.assign({}, obj1, obj2, obj3, etc);

（参见 MDN JavaScript Reference ）

ES5和早期的方法

for (var attrname in obj2) { obj1[attrname] = obj2[attrname]; }

请注意，这只会添加 obj2 到 obj1 如果您仍想使用未经修改的 obj1 ，则可能不是您想要的。

Note that this will simply add all attributes of obj2 to obj1 which might not be what you want if you still want to use the unmodified obj1.

如果你正在使用一个框架来破坏你的原型，那么你必须得到像 hasOwnProperty 这样的支票，但该代码适用于99％的情况。

If you're using a framework that craps all over your prototypes then you have to get fancier with checks like hasOwnProperty, but that code will work for 99% of cases.

示例函数：

/**
 * Overwrites obj1's values with obj2's and adds obj2's if non existent in obj1
 * @param obj1
 * @param obj2
 * @returns obj3 a new object based on obj1 and obj2
 */
function merge_options(obj1,obj2){
    var obj3 = {};
    for (var attrname in obj1) { obj3[attrname] = obj1[attrname]; }
    for (var attrname in obj2) { obj3[attrname] = obj2[attrname]; }
    return obj3;
}

这篇关于如何动态合并两个JavaScript对象的属性？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！