最近仕事でfrontendの開発を少しずつやるようになったのだけど、TypeScriptはGoに比べて演算子や記号を使う記法が多くて読むのに一苦労する。なので「これなんだろう?」と思ったやつをメモしておく。
TypeScriptやっていて一番最初に「ん?」と思ったのは、以下のような構文だった。
const obj = { title: 'hello' } const { title: myTitle } = obj // ★ console.log(myTitle) // "hello"
★のコードでは
- obj というオブジェクトから title という要素を取り出して
- myTitleという定数を宣言
- myTitleに 1. で取り出した要素を代入する
ということをやっている。myTitle
が定数宣言であるのに対して、キーのtitle
は単純にオブジェクトのキーなので特に何かが宣言されているわけでない、ということが初めはわかっていなかったのでこの構文を見るたびに頭が混乱していた。
調べてみると、これはJS由来の構文でDestructuring assignment
と呼ぶらしい。
上の例ではオブジェクトから要素を取り出す例だったが、当然配列から特定の要素を取り出すこともできる。
const array = [1, 2] const [ first, second ] = array console.log(first) // 1
さらにスプレッド構文 ...
を使って以下のような代入も可能。
[a, b, ...rest] = [10, 20, 30, 40, 50]; console.log(rest); [30, 40, 50]
Goと違って多値が返せないからこういう構文が必要になるのかなと思ったのだけど、どうなんだろう?