16.1 概览
在 ECMAScript 6 里,模块存放在文件中。文件和模块是严格一对一关系的。有两种从模块中导出东西的方式。两种方式可以混合使用,但是通常情况下分开使用比较好。
16.1.1 命名导出( 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));
}
//------ main.js ------
import { square, diag } from 'lib';
console.log(square(11)); // 121
console.log(diag(4, 3)); // 5
可以引入整个模块:
//------ main.js ------
import * as lib from 'lib';
console.log(lib.square(11)); // 121
console.log(lib.diag(4, 3)); // 5
16.1.2 默认导出
可以只有单个默认导出。例如,一个函数:
//------ myFunc.js ------
export default function () { ··· } // no semicolon!
//------ main1.js ------
import myFunc from 'myFunc';
myFunc();
或者一个类:
//------ MyClass.js ------
export default class { ··· } // no semicolon!
//------ main2.js ------
import MyClass from 'MyClass';
let inst = new MyClass();
注意,如果默认导出一个函数或一个类的话,语句末尾是没有分号的(这在语义上叫做匿名声明( anonymous declarations ))。
16.1.3 浏览器:脚本对比模块
script | 模块 | |
---|---|---|
HTML 元素 | <script> | <script type="module"> |
顶级的变量是 | 全局变量( global ) | 模块的本地变量 |
顶级的 this 值 |
window | undefined |
执行 | 同步地 | 异步地 |
声明式地引入( 引入语句 ) | 否 | 是 |
编程式地引入( 基于 Promise 的 API ) | 是 | 是 |
文件扩展名 | .js | .js |