読者です 読者をやめる 読者になる 読者になる

ンンンパ

1年間無職だった

ES6のDestructuring assignment(分割代入)でさらに便利記法

JavaScript Typescript 無職日記

分割代入 - JavaScript | MDN

分割代入というのは

let {a, b} = {a: 'a', b: 'b'};
console.log(a, b); // a b

というオブジェクトのキーをもとに変数に展開できる、これだけでも十分便利なものですが、さらに便利にする記法もあります。

変数に別名をつけられます。

let {a: aa, b: bb} = {a: 'a', b: 'b'};
console.log(aa, bb); // a b

2点の比較をする時に{x, y}を返す関数を使っている時に片方だけ展開できなくてどうしようかと思っていましたが、これで安心です。

デフォルト値を設定できます

let {a='1', b='2'} = {a: 'a'};
console.log(a, b); // a 2

let [c='3', d='4'] = ['c'];
console.log(c, d); // c 4

:ではなく=であることに注意しましょう。

なおデフォルト値は取りあつかいに注意が必要な雰囲気がありました。

Destructuring assignmentのご利用は計画的に - Qiita