ES6 模块化语法

 ES6 模块的设计思想，是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量。

7.export和import命令

export另外一种写法
// module1.js
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;

export {firstName, lastName, year};
上面代码在export命令后面，使用大括号指定所要输出的一组变量。它与前一种写法（直接放置在var语句前）是等价的，但是应该优先考虑使用这种写法。因为这样就可以在脚本尾部，一眼看清楚输出了哪些变量。

export命令除了输出变量，还可以输出函数或类（class）
//moudle2.js
export function multiply(x, y) {
  return x * y;
};
上面代码对外输出一个函数multiply。
export命令除了输出变量，还可以输出函数或类（class）
//moudle2.js  
export function multiply(x, y) {
    return x * y;
}
export function jia(x, y) {
    return x + y;
}
export function jian(x, y) {
    return x - y;
}

上面代码对外输出多个函数。
使用export命令定义了模块的对外接口以后，其他 JS 文件就可以通过import命令加载这个模块。

// App.js
import { name, age, sex } from './module1‘
console.log(name + '\t' + age + '\t' + sex);
上面代码的import命令，用于加载module1.js文件，并从中输入变量。import命令接受一对大括号，里面指定要从其他模块导入的变量名。大括号里面的变量名，必须与被导入模块（ module1.js）对外接口的名称相同。

import命令要使用as关键字，将输入的变量重命名。
import { lastName as surname } from './profile';
上面代码使用as关键字，重命名了函数v1和v2的对外接口。重命名后，v2可以用不同的名字输出两次。
import命令具有提升效果，会提升到整个模块的头部，首先执行
foo();
import { foo } from 'my_module';
上面的代码不会报错，因为import的执行早于foo的调用。这种行为的本质是，import命令是编译阶段执行的，在代码运行之前。

import命令具有提升效果，会提升到整个模块的头部，首先执行
foo();
import { foo } from 'my_module';
上面的代码不会报错，因为import的执行早于foo的调用。这种行为的本质是，import命令是编译阶段执行的，在代码运行之前。

import是静态执行，所以不能使用表达式和变量，这些只有在运行时才能得到结果的语法结构。

2.   export default 命令

        使用import命令的时候，用户需要知道所要加载的变量名或函数名，否则无法加载。
         为了给用户提供方便，让他们不用阅读文档就能加载模块，就要用到export default命令，为模块指定默认输出。

// export-default.js
export default function  () {
  console.log('foo');
}
上面代码是一个模块文件export-default.js，它的默认输出是一个函数。

// import-default.js
import customName from './export-default';
customName(); // 'foo'
上面代码的import命令，可以用任意名称指向export-default.js输出的方法，这时就不需要知道原模块输出的函数名。需要注意的是，这时import命令后面，不使用大括号。

export default命令用在非匿名函数前，也是可以的
// export-default.js
export default function foo() {
  console.log('foo');
}
// 或者写成
function foo() {
  console.log('foo');
}
export default foo;
上面代码中，foo函数的函数名foo，在模块外部是无效的。加载的时候，视同匿名函数加载。