模块化(Commonjs与ES6 Module)

模块化(Commonjs与ES6 Module)

描述：

1.CommonJS 和 AMD 模块，都只能在运行时确定这些东西。比如，CommonJS 模块就是对象，输入时必须查找对象属性。

2.ES6 模块的设计思想，是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量。ES6 模块不是对象，而是通过export命令显式指定输出的代码，再通过import命令输入。

注意：es6 module自动开启严格模式。

ES6 Module

使用export导出，import导入。

export

需要特别注意的是，export命令规定的是对外的接口，必须与模块内部的变量建立一一对应关系。

// 报错
export 1;

// 报错
var m = 1;
export m;

解析：上面的两个例子都是直接导出了1，1只是一个值，不是接口。

// 写法一
export var m = 1;

// 写法二
var m = 1;
export {
   m};

// 写法三
var n = 1;
export {
   n as m};

export default

export default默认导出，只能在一个文件中使用一次，无需关联内部接口名。

export default function () {
   
  console.log('foo');
}

正是因为export default命令其实只是输出一个叫做default的变量，所以它后面不能跟变量声明语句

// 正确
export var a = 1;

// 正确
var a = 1;
export