はじめに

皆さんが普段何気なく使っているJavaScriptですが、その仕様はどこで決まっているのでしょうか？

実はJavaScriptにはECMAScript（エクマスクリプト）という仕様があり、その仕様に基づき各ブラウザエンジンに実装されたものが、普段我々が記述しているJavaScriptなのです。

つまりECMAScriptを知ることで、未来のJavaScriptを先取りすることができます。

このシリーズでは、そんなECMAScriptそのものについて、また現在策定中のECMAScriptの仕様の一部を紹介していきます。

ECMAScriptとは

冒頭でも触れましたが、JavaScriptは実装された結果であり、実装のための仕様としてECMAScriptが存在します。

このECMAScriptは、Ecma Internationalという団体により標準化されています。そして、ECMAScriptには検討中の仕様（プロポーザル）がいくつもあり、TC39という専門委員会がその策定をしています。

これらのプロポーザルが、後述するプロセスを経てブラウザエンジンに実装されることで、私たちがJavaScriptとして使えるものになります。

現在どのような仕様が提案されているか、またそれぞれの策定がどの程度進んでいるかなども、GitHubのリポジトリで確認することができるようになっています。

ECMAScriptの策定プロセス

ここで少し、ECMAScriptの仕様の策定プロセスについておさらいしておきましょう。新たな仕様として提出されたプロポーザルは、どのようなプロセスを経て実装されていくのでしょうか。

TC39のドキュメントにあるように、プロポーザルは、次のように5つのステージに分類されます。

Stage	名称	状態
0	Strawman	ただのアイデア
1	Proposal	アイデアがプロポーザルとして認められ、議論を進めている
2	Draft	ドラフトとして、APIや構文についての仕様書がある
3	Candidate	仕様としては完成しており、実装やフィードバックを待っている
4	Finished	仕様の策定が完了している

現在のECMAScriptのリリースサイクルは1年ごとです。毎年のリリースタイミングで、Stage 4となっていたものが、その年のES20**の仕様としてリリースされます。

ただし、ECMAScript仕様としてリリースされたからといって、それがすぐに利用できるわけではありません。基本的には、リリースされた仕様がブラウザエンジンに実装されるのを待つか、Babelのようなトランスパイラを利用する必要があります。

提出されているプロポーザル

さて、このシリーズではそんなECMAScriptのプロポーザルの中から、いくつかを取り上げて紹介していきます。これらは未来のES20**と言えるかもしれません。

GitHubのtc39/proposalsリポジトリにある、記事執筆時点でのStage 1からStage 3の段階にあるプロポーザルを表にしました。

Proposal	Stage
SIMD.JS - SIMD APIs + polyfill	3
Function.prototype.toString revision	3
Lifting Template Literal Restriction	3
Asynchronous Iterators	2
function.sent metaproperty	2
Rest/Spread Properties	2
Shared memory and atomics	2
System.global	2
String.prototype.{trimStart,trimEnd}	2
Public Class Fields	2
Promise.prototype.finally	2
Class and Property Decorators	2
Date.parse fallback semantics	1
export * as ns from "mod"; statements	1
export v from "mod"; statements	1
Observable	1
String#matchAll	1
Private Fields	1
WeakRefs	1
Frozen Realms	1
Cancelable Promises	1
RegExp Unicode Property Escapes	1
Math Extensions	1

既存のオブジェクトへメソッドを追加するものから、まったく新しい機能の提案まで、多種多様なプロポーザルがあります。

次期JavaScriptの記法を先取りしておくという意味では、Stage 2やStage 3のものを見ておくと良いと思います。仕様に入ることが確定していないという意味ではStage 1やStage 0も同じですが、これらはまだAPIや使い方が変更になる可能性が高く、流動的です。

Babelを使う

さて、今後このシリーズでは、Stage 2、Stage 3にあるプロポーザルからいくつかを紹介していきます。

実際に試すにあたっては、ブラウザにはまだ実装されていませんので、Babelのプラグインを使用して解説することになります。ここでその設定にも触れておきます。

Babelの基本的な使い方については、CodeGridでも過去にBabelを取り上げたシリーズ「Babelの手ほどき」がありますので、そちらも併せて参考にしてください。

Babelのプラグインには、それぞれのStageごとのプリセットが用意されています。

• Stage 3 preset
• Stage 2 preset
• Stage 1 preset
• Stage 0 preset

Stage 0のプリセットをインストールすると、Stage 0より上位のStage3までのプリセットに含まれる機能がすべてインストールされます（同様にStage 2のプリセットならStage 2とStage 3が含まれる）。

個別のプロポーザルの機能を試す場合には、プリセットではなく、それぞれ個別のプラグインをインストールするようにします。

また、Stage 2のClass and Property Decoratorsは、現在Stage 2 presetに含まれてないため注意が必要です。この機能を試すには、別途、Babel Legacy Decorator pluginなどといったプラグインが必要です。

トランスパイラの利用について

Babelのようなトランスパイラを使うことで、まだ実装されていない新機能を先取りしたコードを書くことができます。ただし、**"まだ実装されていない"機能が"なぜ使えているのか"**も、あわせて知っておく必要があると筆者は考えています。

トランスパイラはあくまでトランスパイラであり、現在実装されている機能（ES5）の上に成り立っているものです。中には新しい仕様を完全に再現できないケースも存在します。

• その機能はトランスパイラによってどのように実装されるのか
• そもそもどういう仕様なのか

これらのポイントに注意して、トランスパイラは利用すべきです。むしろそうしないのであれば、新しい仕様を先取りしているとは言えません。

おわりに

今回の記事の要点を以下にまとめました。

• JavaScriptにはECMAScriptという仕様があること
• ECMAScriptの新機能はプロポーザルとして提出されていること
• プロポーザルはStageごとに分類・管理されていること
• トランスパイラを使うことで新機能を試すことができること
• ただし、トランスパイラはあくまでトランスパイラであり限界もあること

次回以降の記事では、前述したとおりStage 2、Stage 3のプロポーザルの中から、いくつかの機能を取り上げて紹介していきます。