基于另外两个对象创建一个新的对象

Question

可能是重复问题：
如何动态合并两个JavaScript对象的属性？

我有两个定义为以下形式的对象a和b：

a = { 
  a: 1, 
  af: function() { console.log(this.a) }, 
};
b = { 
  b: 2, 
  bf: function() { console.log(this.b) },
};

现在我想创建另一个对象，它将获取a和b的属性，就像这样：

c = { 
  a: 1, 
  af: function() { console.log(this.a) },
  b: 2, 
  bf: function() { console.log(this.b) },
}

请注意，a和b需要保持不变。

有什么办法可以做到这一点吗？

- Nicolas BADIA

Answer 1

你可以使用for in循环遍历a和b，将所有hasOwn属性复制到一个新对象中。

var c = {};
for (var p in a)
    if(a.hasOwnProperty(p))
         c[p] = a[p];
for (var p in b)
    if(b.hasOwnProperty(p))
         c[p] = b[p];

DEMO

---

或者，如果您正在使用jQuery，可以这样做：

var c = $.extend({}, a, b);

- Adam Rackis

---

jQuery 的解决方案真棒！ - Nicolas BADIA

@NicolasBADIA - 是的，$.extend 很棒。 - Adam Rackis

Answer 2

var i, c={};
for (i in a) { if (a.hasOwnProperty(i)) { c[i] = a[i]; } }
for (i in b) { if (b.hasOwnProperty(i)) { c[i] = b[i]; } }

您可以将此功能抽象为类似于jQuery提供的"扩展"函数：

function extend() {
  var i, j, x, o=(arguments[0] || {});
  for (i=1; i<arguments.length; i++) {
    x = arguments[i];
    for (j in x) { if (x.hasOwnProperty(j)) { o[j] = x[j]; } }
  }
  return o;
}
var c = extend({}, a, b);

- maerics

Answer 3

var desc    = Object.getOwnPropertyDescriptor,
    props   = Object.getOwnPropertyNames,
    define  = Object.defineProperty;

function extend( target ) {
    return {
        with: function( source ) {
            props( source ).forEach(function( key ) {
                define( target, key, desc( source, key ) );
            });
        }
    };
}

现在我们可以这样做

var c = Object.create( null );

extend( c ).with( a );
extend( c ).with( b );

---

^{免责声明：提供的代码假定我们处于 ES5 或已经进行了 ES5 shimed 环境！}

- jAndy