158

私はいつも次のようなコードを書かなければならないことにうんざりしています:

function shallowExtend(obj1,obj2){
  var key;
  for ( key in obj2 ) {
    if ( obj2.hasOwnProperty(key) === false )  continue;
    obj1[key] = obj2[key]
  }
}

または、自分でコードを書きたくない場合は、既にそれを行っているライブラリを実装してください。Object.prototype.extend(obj2...)確かにES6 +はこれで救助に来ており、またはのようなものを提供しますObject.extend(obj1,obj2...)

ES6+ はそのような機能を提供しますか? まだ存在しない場合、そのような機能は計画されていますか? 計画されていない場合、それはなぜですか?

4

6 に答える 6

215

Object.assign を使用して、ES6 で浅いマージ/拡張/割り当てを行うことができます。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

構文：

Object.assign(ターゲット,ソース);

...sourcesはソース オブジェクトを表します。

例：

var obj1 = {name: 'Daisy', age: 30};
var obj2 = {name: 'Casey'};

Object.assign(obj1, obj2);

console.log(obj1.name === 'Casey' && obj1.age === 30);
// true
于 2014-09-16T20:25:29.013 に答える
180

これには、オブジェクト スプレッド構文を使用できます。

const merged = {...obj1, ...obj2}

配列の場合、拡散演算子はすでに ES6 (ES2015) の一部でしたが、オブジェクトの場合、ES9 (ES2018) で言語仕様に追加されました。その提案は、Babel のようなツールではそれ以前からデフォルトで有効になっていました。

于 2015-09-03T09:54:57.700 に答える
16

これは少し古い問題であることは知っていますが、ES2015/ES6 での最も簡単な解決策は、Object.assign() を使用して実際には非常に単純です。

これが役に立てば幸いです。これはDEEPマージも行います。

/**
 * Simple is object check.
 * @param item
 * @returns {boolean}
 */
export function isObject(item) {
  return (item && typeof item === 'object' && !Array.isArray(item) && item !== null);
}

/**
 * Deep merge two objects.
 * @param target
 * @param source
 */
export function mergeDeep(target, source) {
  if (isObject(target) && isObject(source)) {
    for (const key in source) {
      if (isObject(source[key])) {
        if (!target[key]) Object.assign(target, { [key]: {} });
        mergeDeep(target[key], source[key]);
      } else {
        Object.assign(target, { [key]: source[key] });
      }
    }
  }
  return target;
}

使用例:

mergeDeep(this, { a: { b: { c: 123 } } });
// or
const merged = mergeDeep({a: 1}, { b : { c: { d: { e: 12345}}}});  
console.dir(merged); // { a: 1, b: { c: { d: [Object] } } }
于 2016-01-12T17:29:51.770 に答える
9

ES6

Object.assign(o1,o2) ; 
Object.assign({},o1,o2) ; //safe inheritance
var copy=Object.assign({},o1); // clone o1
//------Transform array of objects to one object---
var subjects_assess=[{maths:92},{phy:75},{sport:99}];
Object.assign(...subjects_assess); // {maths:92,phy:75,sport:99}

ES7 またはバベル

{...o1,...o2} // inheritance
 var copy= {...o1};
于 2016-08-16T22:34:54.573 に答える
7

の追加は、Object.mixin現在、あなたが求めている動作を処理するために議論されています. https://mail.mozilla.org/pipermail/es-discuss/2012-December/027037.html

まだ ES6 のドラフトにはありませんが、多くのサポートがあるようですので、まもなくドラフトに反映されると思います。

于 2012-12-14T16:50:04.823 に答える
5

おそらくES5のObject.defineProperties方法でうまくいくでしょうか？

例えば

var a = {name:'fred'};
var b = {age: {value: 37, writeable: true}};

Object.defineProperties(a, b);

alert(a.age); // 37

MDN ドキュメント: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineProperties

于 2012-12-13T05:15:57.170 に答える