ES6 javascript 模块导出选项

Question

我已经看到通过以下两种方式完成的 ES6 模块的公共导出：

 // method 1
export var getAnswer = function () { return 'forty two'; };

// method 2
export default function () { return 'forty two'; };

1. 这两个都有效吗？
2. 如果是这样，为什么它们都存在？
3. 使用 ES6 语法是否有其他有效的模块导出选项？

我很惊讶我无法用我的 googlefu 找到答案。我 只 关心 ES6 模块， 而不 关心 CommonJS、RequireJS、AMD、Node 等。

原文由 kdbanman 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

一年多以后，这是我找到的有关该主题的最佳信息。

出口有4种类型。以下是每个的用法示例，以及一些使用它们的导入：

导出语法

// default exports
export default 42;
export default {};
export default [];
export default (1 + 2);
export default foo;
export default function () {}
export default class {}
export default function foo () {}
export default class foo {}

// variables exports
export var foo = 1;
export var foo = function () {};
export var bar;
export let foo = 2;
export let bar;
export const foo = 3;
export function foo () {}
export class foo {}

// named exports
export {};
export {foo};
export {foo, bar};
export {foo as bar};
export {foo as default};
export {foo as default, bar};

// exports from
export * from "foo";
export {} from "foo";
export {foo} from "foo";
export {foo, bar} from "foo";
export {foo as bar} from "foo";
export {foo as default} from "foo";
export {foo as default, bar} from "foo";
export {default} from "foo";
export {default as foo} from "foo";

导入语法

// default imports
import foo from "foo";
import {default as foo} from "foo";

// named imports
import {} from "foo";
import {bar} from "foo";
import {bar, baz} from "foo";
import {bar as baz} from "foo";
import {bar as baz, xyz} from "foo";

// glob imports
import * as foo from "foo";

// mixing imports
import foo, {baz as xyz} from "foo";
import foo, * as bar from "foo";

// just import
import "foo";

资源。

原文由 kdbanman 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

这两个都是有效的。

方法 1 提供 命名导出。这里的关键是你可以导出不止一件事。这应该用来代替导出具有多个属性的对象。当您导入具有命名导出的模块时，请使用 import {a, b} from c 。

方法 2 提供 默认导出。只能有一个默认导出。这主要在您导出单个东西时使用，例如 class 或单个 function 您希望在没有任何额外支持的情况下使用。使用默认导出导入模块时，请使用 import d from c 。

请注意，您可以同时使用两者！所以如果你有一个主要的、主要的功能和一些偶尔使用的助手，你可以 export 助手，和 export default 主要的。当您导入模块并需要两种导出时，请使用 import d, {a, b} from c 。

另一种选择是您可以通过在模块末尾列出它们来获得命名导出，如下所示： export {a,b,c} 。您也可以重命名它们 export {a as $a, b as c} 。

我从 这篇文章 中获得了所有这些，这是我能够找到的最新 es6 模块信息的最佳来源。

原文由 Sean McMillan 发布，翻译遵循 CC BY-SA 3.0 许可协议