LoginSignup
6
4

More than 5 years have passed since last update.

[Node.js][Babel] import文は他のいかなる文よりも先に実行される

Posted at

TL;DR

Babelでは以下のコードは、

global.foo = 42;
import bar from "bar";

以下のコードと同じ意味。

import bar from "bar";
global.foo = 42;

検証

本記事執筆時点での最新版であるbabel-cli@6.5.1babel-preset-es2015@6.5.0を検証に使う。
Babelはimport文に相当する処理を一番最初に持っていくのかを確認するために、以下のファイルをBabelで変換したコードがどうなるかを調べる。

test.js
global.foo = 42;
import bar from "bar";

次のコマンドを実行する。

npm install babel-cli@6.5.1 babel-preset-es2015@6.5.0
"$(npm bin)"/babel --presets es2015 test.js

結果はこうなる。

"use strict";

var _bar = require("bar");

var _bar2 = _interopRequireDefault(_bar);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

global.foo = 42;

確かにimport文に相当する機能を持つrequire("bar")が一番最初に実行されるコードが出力されていることが分かる。

何故こうなるのか

import文はモジュールのロードを静的に行うためのものなので、他の処理よりも実行順が早くなる。
その仕様をES5の範囲で表現しようとするとBabelのような実装になる。

補足: 細かい話

Babelは、

global.foo = 42;
import bar from "bar";

import bar from "bar";
global.foo = 42;

で同じコードを出力するが、ES2015の仕様としてこの両者が本当に厳密に同じ意味を持つのかは、仕様書を斜め読みしたもののよく分からなかった。
なので念のため、この記事は全体的にES2015でなくBabelに限定した書き方にしている。

6
4
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
6
4