Question

鉴于对象：

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

如何在其他对象中复制属性（secondObject），如下所示：

var secondObject = {
    key1 : 'value1',
    key2 : 'value2',
    key3 : 'value3',
    key4 : 'value4'
};

使用对firstObject的引用？像这样：

var secondObject = {
    firstObject,
    key3 : 'value3',
    key4 : 'value4'
};

（这不起作用......我只是为了说明我想要如何构建代码）。

是否可以使用任何JavaScript框架？

Answer 1

for(var k in firstObject) secondObject[k]=firstObject[k];

Answer 2

从@Bardzuśny的答案中得到启示，ES6提供了一个原生解决方案：Object.assign()功能！

用法很简单：

Object.assign(secondObject, firstObject);

就是这样！

~~现在的支持显然很差;只有Firefox（34+）支持它开箱即用，而Chrome（45+）和Opera（32+）需要设置'实验标志'。~~

支持正在改善，最新版本的Chrome，Firefox，Opera，Safari和Edge支持它（IE显然没有支持。）也可以使用像Babel和Traceur这样的运营商。 See here了解更多详情。

Answer 3

循环遍历第一个对象的属性并将它们分配给第二个对象，如下所示：

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

var secondObject = {
    key3 : 'value3',
    key4 : 'value4'
};

for (var prop in firstObject) {
    if (firstObject.hasOwnProperty(prop)) {
        secondObject[prop] = firstObject[prop];
    }
}

for - in循环是不够的;你需要hasOwnProperty。有关原因的详细说明，请参阅http://bonsaiden.github.com/JavaScript-Garden/#object.forinloop。

Answer 4

每ES6 - Spread syntax：

您可以简单地使用：

const thirdObject = {
   ...firstObject,
   ...secondObject   
}

这可以避免通过引用传递这些对象的问题。

此外，它还会处理具有深度嵌套的对象。

Answer 5

在这里玩死灵法师，因为ES5带来了我们Object.keys()，有可能将我们从所有.hasOwnProperty()次检查中拯救出来。

Object.keys(firstObject).forEach(function(key) {
  secondObject[key] = firstObject[key];
});

或者，将其包装成一个函数（lodash _.assign()的有限“副本”）：

function assign(object, source) {
  Object.keys(source).forEach(function(key) {
    object[key] = source[key];
  });
}

assign(secondObject, firstObject); // assign firstObject properties to secondObject

Object.keys()是一种相对较新的方法，最值得注意的是：在IE中不可用＆lt; 9. .forEach()数组方法实际上也是如此，我用它来代替常规for循环。

幸运的是，这些古老的浏览器可以es5-shim，这将填充许多ES5功能（包括那两个）。

（我只是为了使用polyfills，而不是使用酷炫的新语言功能。）

Answer 6

Necro'ing所以人们可以使用hasOwnProperty和实际对象检查找到深层复制方法：

var extend = function (original, context, key) {
  for (key in context)
    if (context.hasOwnProperty(key))
      if (Object.prototype.toString.call(context[key]) === '[object Object]')
        original[key] = extend(original[key] || {}, context[key]);
      else
        original[key] = context[key];
  return original;
};

Answer 7

可以使用Object.assign来组合对象。它将从右到左组合并覆盖公共属性，即左侧的相同属性将被右侧覆盖。

重要在第一个提供空对象以避免改变源对象。源对象应保持清洁，因为Object.assign()本身会返回一个新对象。

希望这有帮助！

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

var secondObject = {
    key3 : 'value3',
    key4 : 'value4'
};

var finalObject = Object.assign({}, firstObject, secondObject)

console.log(finalObject)

Answer 8

不幸的是，你不能在这样的对象中引用变量。但是，您可以创建一个将对象的值复制到另一个对象的函数。

function extend( obj1, obj2 ) {
    for ( var i in obj2 ) {
        obj1[i] = obj2[i];
    }
    return obj1;
}

var firstObject = {
    key1: "value1",
    key2: "value2"
};

var secondObject = extend({
    key3: "value3",
    key4: "value4"
}, firstObject );

Answer 9

这应该有效，经过测试here。

var secondObject = {
    firstObject: JSON.parse(JSON.stringify(firstObject)),
    key3 : 'value3',
    key4 : 'value4'
};

注意：这不会复制firstObject的方法 注意2 ：要在旧版浏览器中使用，您需要json parser 注3 ：通过引用分配是一个可行的选项，尤其是firstObject包含方法时。相应地调整了给定的jsfiddle示例

Answer 10

如果你想获取仅第二个对象中存在的属性，你可以使用Object.keys来获取第一个对象的属性，你可以做两种方法：

A。） map使用副作用将第一个对象的属性分配给第二个对象：

var a = {a:100, b:9000, c:300};
var b = {b:-1};

Object.keys(a).map(function(key, index) {
    if (typeof b[key] !== 'undefined') {
        console.log(key);
        b[key] = a[key];    
    }
});

B。）或reduce创建新对象并将其分配给第二个对象。请注意，此方法替换第二个对象之前可能具有的与第一个对象不匹配的其他属性：

var a = {a:100, b:9000, c:300};
var b = {b:-1, d:-1}; // d will be gone

b = Object.keys(a).reduce(function(result, current) {
    if (typeof b[current] !== 'undefined') {
        result[current] = a[current];   
    }
    return result;
}, {});

Answer 11

我宁愿使用firstObject作为secondObject的原型，并添加属性描述符：

var secondObject = Object.create(firstObject, {
      key3: {value: "value3", writable: true, configurable: true, enumerable: true},
      key4: {value: "value4", writable: true, configurable: true, enumerable: true}
      });

它当然不是单行，但它可以让你获得更多的控制权。如果您对属性描述符感兴趣，我建议您阅读这篇文章：http://patrickdelancy.com/2012/09/property-descriptors-in-javascript/#comment-2062 和MDN页面https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create

您也可以只分配值并省略描述符并使其缩短：

var secondObject = Object.create(firstObject, {
      key3: {value: "value3"}
      key4: {value: "value4"}
  });

兼容性：ECMAScript 5，IE9 +

Answer 12

kingPuppy想法和OP想法（浅拷贝）的改进-我仅在OP“示例”中添加3个点:)

var secondObject = {
    ...firstObject,
    key3 : 'value3',
    key4 : 'value4'
};

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

var secondObject = {
    ...firstObject,
    key3 : 'value3',
    key4 : 'value4'
};

console.log(secondObject);

Answer 13

var firstObject = {
     key1: "value1",
     key2: "value2"
};

var secondObject = {
     key3: "value3",
     key4: "value4"
     copy: function(firstObject){
           this.key1 = firstObject.key1;
           this.key2 = firstObject.key2;
     }
 };

使用以下方法将复制属性

secondObject.copy(firstObject)

我对javascript非常陌生，但是发现它可以正常工作。我猜有点太长了，但是可以。

Answer 14

为了记录，现在也可以使用

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

var secondObject = {
    ...firstObject,
    key3 : 'value3',
    key4 : 'value4'
};

Answer 15

使用属性传播符号。它是在ES2018中添加的（用于数组/可迭代对象的版本早于ES2015）， {... firstObject}将所有可枚举的属性散布为离散属性。

let secondObject = {
      ...firstObject,
      key3 : 'value3',
      key4 : 'value4'
    }

如何在另一个对象中复制对象属性？

15 个答案: