1.引入模块
①引入默认模块
使用CommonJS标准来引入模块化:为每一个模块设置一个命名空间,即这个模块的容器。
②引入模块部分接口
1
| import {isEmpty} from 'lodash'
|
另外可以从模块中局部引用的结构定义一个别名,以避免指代不明或接口重名的情况出现。
1
| import {createServer as createHTTPServer} from 'http'
|
③引入全部局部接口到指定命名空间
有的模块并不会定义默认接口,而只是定义了若干个命名接口
1
| import * as lib from 'module'
|
③混合引入默认接口和命名接口
1
| import {default as Client,utils} from 'module'
|
引入的默认接口必须要使用as语句被赋予一个别名,不然default作为保留关键字无法使用。
简介方法:
1 2
| import Client,{utils} from 'module' import Client,* as lib from 'module'
|
④不引入接口仅运行模块代码
2.定义模块
ES Module没有模块定义的概念。
ES Module中以文件名及其相对或绝对路径作为该模块被引用时的标识。
3.暴露模块
①暴露单一模块
export语句后所跟着的语句需要具有声明部分(提供所暴露接口的标识)和赋值部分(提供接口的值)。
1 2 3 4 5 6 7 8 9 10
| export const apiRoot = 'https://example.com/api' export function method(){ } export class Foo{ } import {method,Foo} from 'module.js'
|
②暴露模块默认接口
有时候一个模块只需要暴露一个接口,比如需要让一个工具类直接成为这个模块。
1 2 3 4
| export default class Client { } import Client from 'client.js'
|
③混合使用暴露接口语句
export语句和export default语句可以同时使用。
1 2 3 4 5 6 7
| export default class Client{ } export const foo = 'bar' import Client,{foo} from 'module'
|
④从其他模块暴露接口
ES Module提供通过其他模块所暴露的接口作为当前模块接口的方法。
⑤暴露一个模块的所有接口
将import语句和export组合,直接将一个模块的接口暴露到另一个模块上,减少啰嗦代码的产生。
1 2 3
| export function foo() {} export * from 'module-1' import {foo} from 'module'
|
⑥暴露一个模块的部分接口
1 2 3
| export {member} from 'module' export {default as ModulelDefault} from 'module'
|
⑦暴露一个模块的默认接口
可以将一个模块的默认接口作为另一个模块的默认接口。
1
| export {default} from 'module'
|