ES6中的import和export

一、import

语法：

import defaultMember from "module-name";
import * as name from "module-name";
import { member } from "module-name";
import { member as alias } from "module-name";
import { member1 , member2 } from "module-name";
import { member1 , member2 as alias2 , [...] } from "module-name";
import defaultMember, { member [ , [...] ] } from "module-name";
import defaultMember, * as name from "module-name";
import "module-name";

引入模块的整个内容。下例会将myModule添加到当前作用域内，myModule会包含my-module模块暴露的所有东西（但不会包含默认输出的member）：

import * as myModule from 'my-module';

引入模块的单一member。下例会将myMember添加到当前作用域内。

import {myMember} from 'my-module';

引入模块的多个member。下例会将foo和bar都添加到当前作用域内。

import {foo, bar} from 'my-module';

将模块的一个member以别名进行引入。下例会将别名shortName添加到当前作用域内。

import {reallyReallyLongModuleMemberName as shortName} from 'my-module';

将整个模块引入，但是并不需要所引模块中暴露的方法、属性等，需要的只是side effects。可以通过下面这种方法进行引入。说明：比如，你引入一个模块不是为了要用它暴露出来的方法、属性等，只是为了实现某种初始化，这就算side effects。

import 'my-module';

引入模块默认输出的member。

import myDefault from 'my-module';

默认member也可以和其他member一同引入。在这种情况下需要先声明默认member再声明其他member。比如这样：

import myDefault, * as myModule from 'my-module';

或者这样：

import myDefault, {foo, bar} from 'my-module';

二、export

export声明用于暴露给定文件（或模块）中的函数、对象、或JS基本数据类型。

语法：

export { name1, name2, …, nameN };
export { variable1 as name1, variable2 as name2, …, nameN };
export let name1, name2, …, nameN; // also var
export let name1 = …, name2 = …, …, nameN; // also var, const

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

export * from …;
export { name1, name2, …, nameN } from …;
export { import1 as name1, import2 as name2, …, nameN } from …;

export分两种形式：Named exports和Default exports（每个脚本里只能有一个默认输出）。

下面是named exports的例子：

// 暴露一个事先声明的函数
export { myFunction };
// 暴露一个常量
export const foo = Math.sqrt(2);

下面是default export（每个脚本里只能有一个默认输出）的例子（请注意，此处结尾处不用分号）：

export default function() {}

// 或者
export default class {}

请注意，下面这种写法不会暴露默认输出的member：

export * from …;

如果，你需要输出默认member，用下面这种写法替换上面的：

import mod from "mod";
export default mod;

参考资料：

• https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/import
• https://stackoverflow.com/questions/41127479/es6-import-for-side-effects-meaning
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export