Я видел публичный экспорт модулей 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 и т. Д.
javascript
syntax
module
export
ecmascript-6
kdbanman
источник
источник
import x from y
vsimport {x} from y
Ответы:
Спустя год, вот лучшая информация, которую я нашел по этому поводу.
Есть 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";
Источник.
источник
Оба они действительны.
Метод 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, которую мне удалось найти.
источник
Нет,
export function () { return answer; };
недействительно, либо вы используете значение по умолчанию, либо добавляете имя к объявлению этой функции.Они этого не делают :)
Здесь вы можете увидеть множество допустимых вариантов: https://github.com/eslint/espree/pull/43
источник