Javascript中如何组合两个对象的属性【概述】

今天给大家介绍一下js中如何组合两个对象的属性，特别总结了不同js版本的不同实现方法。

ECMAScript 标准方法 2018

ECMAScript2018 建议使用...来实现复合对象。实现代码如下：

/**
 * 时间：2019年8月14日
 * 家庭教程：https://codeqd.com/wp-content/uploads/2023/09/
 */
让我们加入 = {...obj1, ...obj2};

/** 合并的对象数量没有限制
 * 如果属性名相同，后面的对象会覆盖前面的对象 */
const allRules = {...obj1, ...obj2, ...obj3};

ECMAScript 2015 (ES6) 标准方法

ES6 可以使用 Object.assign 方法来组合对象属性。实现代码如下：

/**
 * 时间：2019年8月14日
 * 家庭教程：https://codeqd.com/wp-content/uploads/2023/09/
 */
对象.分配（obj1，obj2）；

/** 合并的对象数量没有限制
 * 所有对象都合并到第一个对象{}
 * 只有第一个参数会被改变并返回
 * 后续对象会覆盖之前对象的属性 */
const allRules = Object.assign({}, obj1, obj2, obj3, 等等); 

ES5或更早版本的实现方法

/**
 * 时间：2019年8月14日
 * 家庭教程：https://codeqd.com/wp-content/uploads/2023/09/
 */
for (var attrname in obj2) { obj1 [attrname] = obj2 [attrname]; }

上面的代码会将所有 obj2 属性添加到 obj1 对象。如果您正在考虑未修改的 obj1，这可能不是您想要的结果。

如果您的项目涉及使用很多原型，您可以使用 hasOwnProperty 方法来检查对象的属性是否来自原型。

案例代码：

/**
 * 时间：2019年8月14日* 家庭教程：https://codeqd.com/wp-content/uploads/2023/09/
 *
 * 用obj2覆盖obj1的值，如果obj1中没有则添加obj2的值
 * @参数obj1
 * @参数obj2
 * @return obj3 一个基于obj1和obj2的新对象
 */
函数 merge_options(obj1,obj2){
    var obj3 = {};
    for (var attrname in obj1) { obj3 [attrname] = obj1 [attrname]; }
    for (var attrname in obj2) { obj3 [attrname] = obj2 [attrname]; }
    返回 obj3；
}

我们也可以封装函数来实现这个功能。下面的代码展示了如何将第一个参数和函数后面的参数作为一个复合对象来组合多个对象的属性并返回第一个参数。 。

/**
 * 时间：2019年8月14日
 * 家庭教程：https://codeqd.com/wp-content/uploads/2023/09/
 *
*/
var 合并 = 函数() {
    var il = 参数.length;
  
    for (var i = il - 1; i > 0; --i) {
      for (var key in argument[i]) {
        if (arguments[i].hasOwnProperty(key)) {
          参数[0][键] = 参数[i][键];
        }
      }
    }
  };