Revision 800747 of Object.assign()

<div>{{JSRef}} {{harmony}}</div>

<p>１つ以上のソースオブジェクトからターゲットのオブジェクトへすべてのすべての独自の列挙プロパティの値をコピーします。戻り値はターゲットオブジェクトです。</p>

<h2 id="Syntax">構文</h2>

<pre class="syntaxbox">
<code>Object.assign(<var>target</var>, ...<var>sources</var>)</code></pre>

<h3 id="Parameters">引数</h3>

<dl>
 <dt><code>target</code></dt>
 <dd>ターゲットオブジェクト</dd>
 <dt><code>sources</code></dt>
 <dd>ソースオブジェクト</dd>
</dl>

<h3 id="Return_value">戻り値</h3>

<p>ターゲットオブジェクト</p>

<h2 id="Description">説明</h2>

<p><code>Object.assign()</code>メソッドはソースをオブジェクトからターゲットオブジェクトへ<em>enumerable</em>で<em>own</em>なプロパティをコピーするだけです。 ソースをオブジェクトで<code>[[Get]]</code>を使いターゲットオブジェクトで<code>[[Put]]</code>を使います。すなわち、gettersとsettersを呼び出します。それゆえ 新しいプロパティをコピーしたり定義してプロパティを<em>割り当てます</em>。これはマージソースがgettersを含んでいるなら新しいプロパティをプロトタイプにマージするのは不適切かもしれません。可算性を含んで、プロパティ定義をプロトタイプにコピーするために、{{jsxref("Object.getOwnPropertyDescriptor()")}} と {{jsxref("Object.defineProperty()")}}が代わりに使われるべきです。</p>

<p>{{jsxref("String")}} と {{jsxref("Symbol")}} プロパティの両方がコピーされます。</p>

<p>エラーの場合、例えば、プロパティが書き込めない場合、{{jsxref("TypeError")}}が起こります。<code>target</code> オブジェクトは変更されないままです。</p>

<p><code>Object.assign()</code>は{{jsxref("null")}}か{{jsxref("undefined")}}ソース値ではスローされないことに注意して下さい。</p>

<h2 id="Examples">例</h2>

<h3 id="Cloning_an_object">オブジェクトをクローンする</h3>

<pre class="brush: js">
var obj = { a: 1 };
var copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }
</pre>

<h3 id="Merging_objects">オブジェクトをマージする</h3>

<pre class="brush: js">
var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { c: 3 };

var obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1);  // { a: 1, b: 2, c: 3 }, target object itself is changed.
</pre>

<h3 id="Copying_symbol-typed_properties">シンボル型プロパティをコピーする</h3>

<pre class="brush: js">
var o1 = { a: 1 };
var o2 = { [Symbol('foo')]: 2 };

var obj = Object.assign({}, o1, o2);
console.log(obj); // { a: 1, [Symbol("foo")]: 2 }
</pre>

<h3 id="Inherit_properties_and_non-enumerable_properties_cannot_be_copied">プロパティを継承して非列挙プロパティはコピされない</h3>

<pre class="brush: js">
var obj = Object.create({ foo: 1 }, { // foo is an inherit property.
  bar: {
    value: 2  // bar is a non-enumerable property.
  },
  baz: {
    value: 3,
    enumerable: true  // baz is an own enumerable property.
  }
});

var copy = Object.assign({}, obj);
console.log(copy); // { baz: 3 }
</pre>

<h3 id="Primitives_will_be_wrapped_to_objects">プリミティブ型はオブジェクトにラップされる</h3>

<pre class="brush: js">
var v1 = '123';
var v2 = true;
var v3 = 10;
var v4 = Symbol('foo')

var obj = Object.assign({}, v1, null, v2, undefined, v3, v4); 
// Primitives will be wrapped, null and undefined will be ignored.
// Note, only string wrappers can have own enumerable properties.
console.log(obj); // { "0": "1", "1": "2", "2": "3" }
</pre>

<h3 id="Exceptions_will_interrupt_the_ongoing_copying_task">例外が現在進行中のコピータスクを中断する</h3>

<pre class="brush: js">
var target = Object.defineProperty({}, 'foo', {
  value: 1,
  writeable: false
}); // target.foo is a read-only property

Object.assign(target, { bar: 2 }, { foo2: 3, foo: 3, foo3: 3 }, { baz: 4 });
// TypeError: "foo" is read-only
// The Exception is thrown when assigning target.foo

console.log(target.bar);  // 2, the first source was copied successfully.
console.log(target.foo2); // 3, the first property of the second source was copied successfully.
console.log(target.foo);  // 1, exception is thrown here.
console.log(target.foo3); // undefined, assign method has finished, foo3 will not be copied.
console.log(target.baz);  // undefined, the third source will not be copied either.
</pre>

<h3 id="Copying_accessors">アクセッサーをコピーする</h3>

<pre class="brush: js">
var obj = {
  foo: 1,
  get bar() {
    return 2;
  }
};

var copy = Object.assign({}, obj); 
console.log(copy); 
// { foo: 1, bar: 2 }, the value of copy.bar is obj.bar's getter's return value.

// This is an assign function which can copy accessors.
function myAssign(target, ...sources) {
  sources.forEach(source =&gt; {
    Object.defineProperties(target, Object.keys(source).reduce((descriptors, key) =&gt; {
      descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
      return descriptors;
    }, {}));
  });
  return target;
}

var copy = myAssign({}, obj);
console.log(copy);
// { foo:1, get bar() { return 2 } }
</pre>

<h2 id="Polyfill">互換性</h2>

<p>この互換性はシンボルプロパティをサポートしません。というのも、ES5では シンボルを持っていないからです。:</p>

<pre class="brush: js">
if (!Object.assign) {
  Object.defineProperty(Object, 'assign', {
    enumerable: false,
    configurable: true,
    writable: true,
    value: function(target, firstSource) {
      'use strict';
      if (target === undefined || target === null) {
        throw new TypeError('Cannot convert first argument to object');
      }

      var to = Object(target);
      for (var i = 1; i &lt; arguments.length; i++) {
        var nextSource = arguments[i];
        if (nextSource === undefined || nextSource === null) {
          continue;
        }
&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;nextSource = Object(nextSource);

        var keysArray = Object.keys(Object(nextSource));
        for (var nextIndex = 0, len = keysArray.length; nextIndex &lt; len; nextIndex++) {
          var nextKey = keysArray[nextIndex];
          var desc = Object.getOwnPropertyDescriptor(nextSource, nextKey);
          if (desc !== undefined &amp;&amp; desc.enumerable) {
            to[nextKey] = nextSource[nextKey];
          }
        }
      }
      return to;
    }
  });
}
</pre>

<h2 id="Specifications">仕様</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">仕様</th>
   <th scope="col">ステータス</th>
   <th scope="col">コメント</th>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-object.assign', 'Object.assign')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td>Initial definition.</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility">ブラウザ実装状況</h2>

<div>{{CompatibilityTable}}</div>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>機能</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>基本サポート</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatGeckoDesktop("34")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>機能</th>
   <th>Android</th>
   <th>Chrome for Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>基本サポート</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatGeckoMobile("34")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="See_also">関連情報</h2>

<ul>
 <li>{{jsxref("Object.defineProperties()")}}</li>
</ul>