ES6-Module

模块功能主要由两个命令构成：export和import

• 输出：export default 名字
• 引入文件：import 变量名 from ‘默认输出文件的路径’;
• 输出方法：export const 方法名 = (变量) => { return 返回的结果 }
• 引入方法：import { 方法名 } from ‘路径’

export

var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
//输出变量
export { firstName, lastName, year };
//函数
export function foo(){}
可以使用as关键字重命名。
export { firstName as  f, lastName, year };

import

• import { 输入的对象 } from ‘路径’;
• 多次执行同一语句，只执行一次

export default 默认指定输出

export default function () {
	console.log('foo');// 默认指定输出foo
}

其它文件引入时可直接另起名字
import customName from '默认输出文件的路径';
customName(); // 'foo'

对比：import是否用{ }                    
如果想在一条import语句中，同时输入默认方法和其他接口，可以写成下面这样。
import _, { each, forEach } from 'lodash'; //each as forEach    

export 与 import 的复合写法

export * as ns from "mod"; // *表输出这个模块的所有模块和方法，但会忽略该模块的default方法
// 等同于
import * as ns from "mod";
export {ns};//但当前模块不能直接使用ns

import()类似于 Node.js 的require()方法

• 区别主要是前者是异步加载，后者是同步加载

1. 按需加载

   button.addEventListener('click', event => {
   import('./dialogBox.js')
   .then(dialogBox => {
   		dialogBox.open();
   })
   .catch(error => {
   		/* Error handling */
   })
   });

2. 条件加载 （if…else）
3. 动态模块路径
   • import(f())
   • .then(…);

注意：不使用require()