Параметры экспорта модуля 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 и т. Д.

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

Источник.

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, которую мне удалось найти.

Answer 3

1. Оба они действительны?

Нет, export function () { return answer; }; недопустимо, либо вы используете значение по умолчанию, либо добавляете имя к объявлению этой функции.

2. Если так, то почему они оба существуют?

Они не:)

3. Существуют ли другие допустимые параметры для экспорта модулей с использованием синтаксиса ES6?

Вы можете увидеть много действительных вариантов здесь: https://github.com/eslint/espree/pull/43