module
在javascript出ES6以前,是不支持原生的模块化的,所以,我们会看到会有外部工具来实现模块的功能,比如遵循CMD规范的Seajs和AMD的RequireJS。在ES6,模块已经作为重要的组成部分被添加进来了。
模块的主要功能由export
和import
组成,并且每一个模块都有自己单独的作用域,模块之间的相互调用关系是通过export
来规定模块对外暴露接口,通过import
来引用其它模块提供的接口。同时还为模块创造了命名空间,防止函数的命名冲突。
export,import命令
//info.js
export var name = 'skyeTang'
ES6将一个文件视为一个模块,上面的模块通过export
向外输出了一个变量。一个模块可以同时往外输出多个变量。
//info.js
var name = 'skyeTang';
var age = '19';
export {name,age};
定久好的模块的输出以后,就可以直接在另一个模块通过import
引用。
//main.js
import {name,age} from './info.js'
整体输入,module指令
//info.js
export function getName(){
return name;
}
export function getAge(){
return age;
}
通过import * as
完成了模块整体的导入。
import * as info from './info.js'
通过module
也可达到整体的输入。
module info from 'info.js';
info.getName();
export default
不用关心模块输出了什么,通过export default
指令就能加载到默认模块,不需要通过{}来指定输出的模块,一个模块只能用一次export default
//default 导出
export default function getAge(){}
//或者
function getAge(){}
export default getAge;
//导入的时候就不需要花括号了
import info from './info.js';
当然,一个import
是可以同时导入默认方法和其它变量的。
import defaultMethod,{otherArg} from 'xxx.js'