JS ES2015模块的导入与导出

本文适用于ES2015(ES6)标准的js模块的语法与用法。

导出

export 语句用于从模块中导出实时绑定的函数、对象或原始值，以便其他程序可以通过 import 语句使用它们。被导出的绑定值依然可以在本地进行修改。在使用import进行导入时，这些绑定值只能被导入模块所读取，但在export导出模块中对这些绑定值进行修改，所修改的值也会实时地更新。

更多教程:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/export

导出单个特性对象

对象，方法，类

export let name1, name2, …, nameN; // also var, const
export let name1 = …, name2 = …, …, nameN; // also var, const
export function FunctionName(){...}
export class ClassName {...}

导出多个对象

export { name1, name2, …, nameN };

重命名导出

export { variable1 as name1, variable2 as name2, …, nameN };

解构导出并重命名

export const { name1, name2: bar } = o;

设置默认导出的对象

export default expression;
export default function (…) { … } // also class, function*
export default function name1(…) { … } // also class, function*
export { name1 as default, … };

导出模块合

export * from …; // 没有设置默认导出
export * as name1 from …; // ECMAScript®2O21草案
export { name1, name2, …, nameN } from …;
export { import1 as name1, import2 as name2, …, nameN } from …;
export { default } from …;

导入

静态的import 语句用于导入由另一个模块导出的绑定。无论是否声明了 strict mode ，导入的模块都运行在严格模式下。

在浏览器中，import 语句只能在声明了 type="module" 的 script 的标签中使用。

低版本浏览器，注意转换代码。

import defaultExport from "module-name";
import * as name from "module-name";
import { export } from "module-name";
import { export as alias } from "module-name";
import { export1 , export2 } from "module-name";
import { foo , bar } from "module-name/path/to/specific/un-exported/file";
import { export1 , export2 as alias2 , [...] } from "module-name";
import defaultExport, { export [ , [...] ] } from "module-name";
import defaultExport, * as name from "module-name";
import "module-name";
var promise = import("module-name");//这是一个处于第三阶段的提案。

更多教程:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/import