「ある配列やオブジェクトの1部だけを使うからそれだけ取り出して使いたい」ような時に使えます。
Object
const {取り出したいプロパティ名} = ...
とするだけです。
const {a, c} = {a: 1, b: 2, c: 3};
console.log(a); // 1
console.log(c); // 3
万が一同じ名前の変数がスコープ上にあるなら:
で別名をつけることができます。
const {a: alias} = {a: 1};
console.log(alias); // 1
また=
を使うことで、その値がundefined
の時にデフォルト値が入るようにできます。
const {c = 3} = {a: 1};
console.log(c); // 3
組み合わせると。
const {d: aliasOfD = 4} = {a: 1};
console.log(aliasOfD); // 4
Array
最初の要素だけ取りたい場合は、
const [first] = [1, 2, 3];
console.log(first); // 1
最後だけならカンマで頭の要素を飛び越えて取得します。
const [,,first] = [1, 2, 3];
console.log(first); // 1
またそれ以降の要素をすべて取得したいなら...
を使います。
const [,...tail] = [1, 2, 3];
console.log(tail); // [2, 3]
ただ、これは最後の変数値にしか使えません。
const [...head,] = [1, 2, 3];
// これは駄目!
また配列も=
でデフォルト値を設定できます。
const [first = 1] = [];
console.log(first); // 1
...
の方には設定できません。
const [, ...tail = [2, 3]] = [1];
// SyntaxError: Invalid destructuring assignment target