LoginSignup
24
12

More than 3 years have passed since last update.

【Babel】ES2019までの構文はバベられる?バベられない?まとめ

Last updated at Posted at 2018-12-03

この記事は フューチャー Advent Calendar 2018 4日目の記事です。
1日目に「脱Babel!」言われましたが僕は泣きません。明日も元気にバベっていきます。

みなさまはESのバージョンはどのバージョンでJavaScript書いていますでしょうか?
とりあえず2015という人も、asyncまではつかう2017な人も、2018の正規表現もガンガン使っちゃうモダンな人も、stage-3も使っちゃう未来人もいるでしょう。
(え?ES5??すみませんが本記事は全く役に立ちません。)

しかし、その構文、バベってブラウザ要件満たせるやつでしたっけ?Chromeでしか動かないんじゃないの?って気になりませんか?
私は気になって調べようと思ったので、調べついでに記事にします。
(間違ってたらごめんなさい。指摘くれると嬉しいです。)
(Polyfillで解決できるような追加メソッドやプロパティは対象にしません。)
(あと、疲れたのでstage-3以下は対象にしません。)

各構文の調べ方

構文はeslint-plugin-esルール一覧で見ていこうと思います。どう考えても使い方違いますが年ごとに綺麗に一覧になってるので。
そこから、tc39/proposalsbabelのPlugins@babel/preset-envの中とか見ながら集めようと思います。

:100: ES2019

バベられる。

:warning: ES2018

:100: ES2017

バベられる。

:100: ES2016

バベられる。

:100: ES2015

全部バベられる。

まとめ

正規表現はもう少し悲惨な結果になると思ったら、ほとんど対応しててびっくりした。
結果的も、対応してなさそうなのは、ES2018の正規表現関連の2つだけでしたね。

というわけで、eslint-plugin-esの、es/no-regexp-lookbehind-assertionses/no-regexp-named-capture-groupsを検出できるようにしておけば、うっかりバベられない構文を使ってしまうことはなくなります。

あとがき

記事のタイトルに「まとめ」って空気出すといいらしいって聞いたので「まとめ」って入れてみました。「お前らのJavaScriptはバベられない!」っていうのも考えましたが、結局ほとんどバベられるし違う気がしたので控えました。

どうでもいいけど、「バベられる」でググると 聖☆おにいさん が出てきますね。

この記事書くの思ってたより疲れた。

24
12
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
24
12