ES2015（ES6）里有了自己的模块机制，写法大致如下：
import {someModule} from "someModule";
// your codes...
export default anotherModule; export {anotherModule};
到目前为止,javascript (ES5及以前)还不能支持原生的模块化，大多数的解决方案都是通过引用外部的库来实现模块化。比如 遵循CMD规范的 Seajs 和AMD的 RequireJS 。
在ES6中，模块将作为重要的组成部分被添加进来。模块的功能主要由 export 和 import 组成.每一个模块都有自己单独的作用域，模块之间的相互调用关系是通过 export 来规定模块对外暴露的接口，通过import来引用其它模块提供的接口。同时还为模块创造了命名空间，防止函数的命名冲突。
1、导出
ES6将一个文件视为一个模块，一个模块通过export向外输出了一个变量，也可以同时往外面输出多个变量。
There are two kinds of exports: named exports (several per module) and default exports (one per module).
命名导出(named exports) 在需要导出的地方加上一个 export 关键字
默认导出，就是指定一个变量作为默认值导出 默认导出的时候不需指定一个变量名，默认是文件名。一个模块只能使用 export default 一次。
ES6规范只支持静态的导入和导出，也就是必须要在编译时就能确定，在运行时才能确定的是不行的
（1）命名导出(named exports)
Multiple named exports
There can be multiple named exports:
//------ lib.js ------
export const sqrt = Math.sqrt;
export function square(x) {
return x * x;
}
export function diag(x, y) {
return sqrt(square(x) + square(y));
}
//命名导出
export var myVar1 = ...;
export let myVar2 = ...;
export const MY_CONST = ...;
export function myFunc() {
...
}
export function* myGeneratorFunc() {
...
}
export class MyClass {
...
}
//也可以自己列出所有导出内容
const MY_CONST = ...;
function myFunc() {
...
}
export { MY_CONST, myFunc };
//或者在导出的时候给他们改个名字
export { MY_CONST as THE_CONST, myFunc as theFunc };
//还可以导出从其他地方导入的模块
export * from 'src/other_module';
export { foo, bar } from 'src/other_module';
export { foo as myFoo, bar } from 'src/other_module';
（2）默认导出
Single default export
There can be a single default export. For example, a function:
//------ myFunc.js ------
export default function () { ··· } // no semicolon!
//------ main1.js ------
import myFunc from 'myFunc';
myFunc();
Or a class:
//------ MyClass.js ------
export default class { ··· } // no semicolon!
// default导出
export default 123;
export default function (x) {
return x
};
export default x => x;
export default class {
constructor(x, y) {
this.x = x;
this.y = y;
}
};
2、导入
ES6提供了如下几种导入方式：
//------ main.js ------
import { square, diag } from 'lib';
//------ main2.js ------
import MyClass from 'MyClass';
let inst = new MyClass();
Note that there is no semicolon at the end if you default-export a function or a class (which are anonymous declarations)
// Default exports and named exports
import theDefault, { named1, named2 } from 'src/mylib';
import defaultMethod, { otherMethod } from 'xxx.js';
import theDefault from 'src/mylib';
import { named1, named2 } from 'src/mylib';
// Renaming: import named1 as myNamed1
import { named1 as myNamed1, named2 } from 'src/mylib';
// Importing the module as an object (with one property per named export)
import * as mylib from 'src/mylib';
通过 import * as 就完成了模块整体的导入。
You can also import the complete module:
import * as lib from 'lib';
通过指令 module 也可以达到整体的输入。
module test from 'test.js';
//声明引用的模块
module point from "/point.js";
//这里可以看出，尽管声明了引用的模块，还是可以通过指定需要的部分进行导入
import Point from "point";
// Only load the module, don’t import anything
import 'src/mylib';;