11
Nov 2019
JavaScriptの仕様標準であるECMAScriptはTC39という団体により使用が策定されています。 ProposalはGithubのレポジトリにまとめられています。
Proposalにはstageというものがあり、stage 0から順にstage 4へ上がっていくというプロセスを経て最終的にECMAScriptに採用されます。
- Stage 0 - Strawman(たたき台)
- アイデア段階
- Stage 1 - Proposal(提案)
- 必要性や解決方法についての説明がある
- 実際にPolyfillやデモが実装される
- Stage 2 - Draft(下書き)
- 仕様書の初期案
- 具体的な構文についての案
- Stage 3 - Candidate(候補)
- 仕様書が完成
- レビュアーによる承認
- ECMAScriptのエディタによる承認
- Stage 4 - Finished(完了)
- 主要な2つJSエンジンでの実装が必要
- ECMAScriptのエディタによる承認
- 標準仕様としてリリース待ちの状態
気になるProposalたち
Array.prototype.flat / Array.prototype.flatMap
- ECMAScript2019 (ES10)
IE / Edge 以外はもう使えます。
const arr1 = [1, 2, [3, 4]] const result = arr1.flat() // -> [1, 2, 3, 4] arr1 // -> [1, 2, [3, 4]]
引数にはdepthを指定します
const arr1 = [1, 2, [3, [4, 5]]] arr1.flat(1) // -> [ 1, 2, 3, [ 4, 5 ] ] arr1.flat(2) // -> [ 1, 2, 3, 4, 5 ]
flatMap
は最初に各要素をマップして、フラットにした配列を返します。
const arr1 = ["it's Sunny in", "", "California"]; arr1.map(x => x.split(" ")); // -> [["it's","Sunny","in"],[""],["California"]] arr1.flatMap(x => x.split(" ")); // -> ["it's","Sunny","in", "", "California"]
Numeric Separators
- stage 3
桁数の多い数字を読みやすくするために、_
を使えるようにするものです。
1_000_000 1_234_500
https://github.com/tc39/proposal-numeric-separator
Optional Chaining
- stage 3
ネストしたオブジェクトのプロパティにアクセスする際、中間にあるプロパティが存在しないとエラーがおきます。
const o = { foo: { bar: { baz: 0 } } } o.foo.non.baz // -> Uncaught TypeError: Cannot read property 'baz' of undefined
そのため、以下のようにチェックすることが多いのではないでしょうか
o.foo.bar && o.foo.bar.baz
Optional Chainingでは以下のように?.
を使うことで、左側のプロパティがnull
やundefined
の場合にundefined
が返るようになります。
o.foo.bar?.baz
APIから取得したJSONを扱う際に頻発するケースなので、すぐにでも使いたいですね。
https://github.com/tc39/proposal-optional-chaining
TypeScriptなら 3.7.2~ で使えるようになりました。
The Pipeline Operator
- stage 1
新しい演算子 |>
です。左辺の値を引数として、右辺の関数を呼び出すことができます。
x |> f // ==> f(x)
例えば以下のように、複数の関数呼び出しが行う場合
const double = (n) => n * 2; const increment = (n) => n + 1; double(increment(double(10)))
以下のように書けるようになります。
10 |> double |> increment |> double