Nested import declarations - TC39 Proposals #JavaScript

この記事は2019年10月9日に書いたものであり、#tc39_study TC39 Proposals LT 大会で使用したもの。

この機能はまだ未策定かつ変更の可能性が高い。

状況

Stage : 0
URL : https://github.com/benjamn/reify/blob/master/PROPOSAL.md
Champion : Ben Newman
- この頃はFacebookやMozillaに居たかもしれないが、今はMeteorでApolloの開発者ぽい

提案内容

importをtop level以外でも使用できるようにするというもの。

関数内にネスト可能で、スコープは関数内に限定し、同期的宣言。


if (condition) import "./sometimes";

if (condition) {
  import "./sometimes";
}

if (condition) let foo = bar;

Dynamic importとの違い

非同期関数内のみで動作する。

async function main() {
  const hoge = await import('./hoge.js');
  hoge()
}

このDynamic importはすでに現在EdgeやIE以外の主要ブラウザで使用できる。

Dynamic importとの関係

Dynamic importのproposalの「A new binding form」の部分を読むと記載があるが、2016年7月のTC39 meetingでNested import declarationsの話し合いがあり、そこで当時Stage1にいたDynamic importの前身?であるawait importの提案を待つように言われている。

同期的なimportの提案なので、ブラウザやtop levelのimportとの関係性に問題があるという話などが行われていた。

先ほど記載したようにawait importの提案を待つように言われており、本人は同期宣言を望んでいたが、どうやら叶わなかったらしい。

まだInactive Proposalsに入らず、Stage0に居るので、もしかしたら動くこともあるかもしれない。

最後に

このNested import declarationsを読む前はDynamic importがあり、Stage0から上がらなさそうなのに、なんで読もうとしているのだろうという気持ちだったが。

Dynamic importとの関係性や2016年の話し合いを知れて、おもしろかった。