ES6模块系统具有以下特性:
- 使用export关键词导出对象。这个关键字可以无限次使用;
- 使用import关键字将其它模块导入某一模块中。它可用来导入任意数量的模块;
- 支持模块的异步加载;
- 为加载模块提供编程支持。
导出对象
在现有的模块系统中,每个JavaScript代码文件在ES6中都是一个模块。只有模块中的对象需要被外部调用时,模块才会输出对象,其余则都是模块的私有对象。该处理方式将细节进行封装,仅导出必要的功能。
单个导出(内联导出)
一个模块中可无数次使用export,所有的对象将被一起导出。
export var haha = 'haha'
export class lala {
...
}
export function gaga () {
...
}
成组导出
一齐导出该模块中的全部对象。
var haha = 'haha'
class lala {
...
}
function gaga () {
...
}
export {haha, lala, gaga};
在导出时,可以重命名方便其他模块调用。
export {
new_haha as haha,
new_lala as lala
};
Default导出
使用关键字default,可将对象标注为default对象导出。default关键字在每一个模块中只能使用一次。它既可以用于内联导出,也可以用于一组对象导出声明中。
内联
export default var haha = 'haha'
export default class lala {
...
}
export default function gaga () {
...
}
成组
export default {
haha,
lala,
gaga
};
导入模块
现有模块可以使用关键字import导入到其它模块。一个模块可以被导入任意数量的模块中。
无对象导入
模块包含一些逻辑要执行,不需要导出任何对象
import './moduleNoOutObj.js';
** 导入默认对象**
import ha from './moduleDefault.js';
** 导入命名的对象**
import {haha, lala} from './module.js';
导入默认对象和命名对象(同时)
import {default as ha, haha} from './module.js';
这种情况下,默认对象必须定义一个别名
** 导入所有对象**
import * as sasa from './module.js';
sasa这一别名将指向所有从module导出的对象。在导入模块中,它们作为属性可被访问。
可编程式的按需导入
如果想基于某些条件或等某个事件发生后再加载需要的模块,可通过使用加载模块的可编程API(programmatic API)来实现。使用System.import方法,可按程序设定加载模块。这是一个异步的方法,并返回Promise。
该方法的语法示例如下:
System.import('./module1.js')
.then(function(module1){
//use module1
}, function(e){
//handle error
});
如果模块加载成功且将导出的模块成功传递给回调函数,Promise将会通过。如果模块名称有误或由于网络延迟等原因导致模块加载失败,Promise将会失败。