es6运行机制借鉴整理

// m.js
import {a} from './n';
console.log('3');
console.log(a);

// n.js
console.log('1');
export const a = 'a';
console.log('2');

输出结果：

->1
->2
->3
->a

接下来吧conlole.log(a)去掉后再次看一下输出结果：

->1
->2
->3

思考：为什么会出现这种情况呢？

在阮一峰老师的《ECMAScript 6 入门》里讲到：ES6模块的运行机制与CommonJS不一样，它遇到模块加载命令import时，不会去执行模块，而是只生成一个动态的只读引用。等到真的需要用到时，再到模块里面去取值，换句话说，ES6的输入有点像Unix系统的“符号连接”，原始值变了，import输入的值也会跟着变。

可是按照上面说的，那有console.log(a)的时候，应该是输出3,1,2的顺序，而不是1,2,3的顺序呀。我猜测是上面讲的不细致的原因，应该分为编译时和运行时来说。ES6的这种加载称为编译时加载或者静态加载，即 ES6 可以在编译时就完成模块加载，在编译的时候，发现了后面有使用到a的地方，就在运行时遇到import的地方直接执行了模块的代码。