Skip to content

Commit

Permalink
feat(object): spread構文を追加
Browse files Browse the repository at this point in the history
fix  #349
fix #425
  • Loading branch information
azu committed Oct 23, 2018
1 parent 3d962a7 commit d8221d3
Showing 1 changed file with 38 additions and 1 deletion.
39 changes: 38 additions & 1 deletion source/basic/object/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -592,7 +592,7 @@ console.log(merged === objectA); // => true
空のオブジェクトを`target`にすることで、既存のオブジェクトには影響を与えずマージしたオブジェクトを作ることができます。
そのため、`Object.assign`メソッドの第一引数には、空のオブジェクトリテラルを指定するのが典型的な利用方法です。

このとき、プロパティ名が重複した場合は、後ろのオブジェクトにより上書きされます
このとき、プロパティ名が重複した場合は、後ろのオブジェクトのプロパティにより上書きされます
JavaScriptでは、基本的な処理は左から順番に行います。
そのため左から順にオブジェクトが代入されていくと考えるとよいです。

Expand All @@ -606,6 +606,43 @@ const merged = Object.assign({}, objectA, objectB);
console.log(merged); // => { version: "b" }
```

ES2018ではオブジェクトのマージを構文として行える`...`(spread構文)が追加されました。
ES2015で配列の要素を展開する`...`(spread構文)はサポートされていましたが、オブジェクトに対してもES2018でサポートされました。
オブジェクトの`...`(spread構文)は、オブジェクトリテラルの中に指定したオブジェクトのプロパティを展開できます。

オブジェクトの`...`(spread構文)は、`Object.assign`とは異なり必ず新しいオブジェクトを作成し返します。
なぜなら`...`(spread構文)はオブジェクトリテラルの中でのみ記述でき、オブジェクトリテラルは新しいオブジェクトを返すためです。

次のコードでは`objectA``objectB`をマージした新しいオブジェクトを返します。

{{book.console}}
```js
const objectA = { a: "a" };
const objectB = { b: "b" };
const merged = {
...objectA,
...objectB
};
console.log(merged); // => { a: "a", b: "b" }
```

プロパティ名が被った場合の優先順位は、後ろにあるプロパティほど優先されます。
そのため同じプロパティ名をもつオブジェクトをマージした場合には、後ろのオブジェクトによってプロパティが上書きされます。

{{book.console}}
```js
// `version`のプロパティ名が被っている
const objectA = { version: "a" };
const objectB = { version: "b" };
const merged = {
...objectA,
...objectB,
other: "other"
};
// 後ろにある`objectB`のプロパティで上書きされる
console.log(merged); // => { version: "b", other: "other" }
```

#### オブジェクトの複製 {#copy}

<!-- textlint-disable preset-ja-technical-writing/max-ten -->
Expand Down

0 comments on commit d8221d3

Please sign in to comment.