导出语法

Question

我已经看到ES6模块的公共出口有以下两种方式：

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

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

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

我很惊讶我用googlefu找不到答案。我只关注与ES6模块，不 CommonJS，RequireJS，AMD，Node等。

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";

Source.

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}。

我从this article得到了所有这些，这是我能够找到的最新es6模块信息的最佳来源。

Answer 3

这两个都有效吗？

不，export function () { return answer; };无效，要么使用默认值，要么为该函数声明添加名称。

如果是这样，为什么它们都存在？

他们没有：）

使用ES6语法还有其他有效的模块导出选项吗？

您可以在此处看到许多有效选项：https://github.com/eslint/espree/pull/43

ES6 + javascript模块导出选项

3 个答案:

导出语法

导入语法