Widziałem publiczne eksportowanie modułów ES6 na oba poniższe sposoby:
// method 1
export var getAnswer = function () { return 'forty two'; };
// method 2
export default function () { return 'forty two'; };
- Czy oba są ważne?
- Jeśli tak, dlaczego obie istnieją?
- Czy istnieją inne prawidłowe opcje eksportu modułów przy użyciu składni ES6?
Dziwię się, że nie udało mi się znaleźć odpowiedzi na moim googlefu. Zajmuję się tylko modułami ES6, a nie CommonJS, RequireJS, AMD, Node itp.
javascript
syntax
module
export
ecmascript-6
kdbanman
źródło
źródło
import x from y
vsimport {x} from y
Odpowiedzi:
Rok i trochę później, oto najlepsze informacje, jakie znalazłem na ten temat.
Istnieją 4 rodzaje eksportu. Oto przykłady użycia każdego z nich wraz z niektórymi importami, które z nich korzystają:
Eksportuj składnię
// 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";
Importuj składnię
// 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";
Źródło.
źródło
Oba są ważne.
Metoda 1 zapewnia nazwane eksporty . Najważniejsze jest to, że możesz wyeksportować więcej niż jedną rzecz. Powinno to być używane zamiast eksportowania obiektu z wieloma właściwościami. Podczas importowania modułu z nazwanymi eksportami użyj
import {a, b} from c
.Metoda 2 zapewnia domyślny eksport . Może istnieć tylko jeden domyślny eksport. Jest to używane głównie, gdy eksportujesz jedną rzecz, taką jak a
class
, lub jednąfunction
, której spodziewasz się użyć bez dodatkowego wsparcia. Podczas importowania modułu z domyślnym eksportem użyjimport d from c
.Pamiętaj, że możesz używać obu! więc jeśli masz główną, podstawową funkcję z kilkoma okazjonalnie używanymi pomocnikami, możesz to zrobić
export
jako pomocnicy iexport default
podstawowa. Kiedy importujesz moduł i potrzebujesz obu rodzajów eksportu, użyjimport d, {a, b} from c
.Jedna inna opcja jest taka, że można uzyskać nazwie eksportu wymieniając je na końcu modułu, tak:
export {a,b,c}
. Możesz także zmienić ich nazwyexport {a as $a, b as c}
.Wszystko to znalazłem w tym artykule , który jest najlepszym źródłem aktualnych informacji o module es6, jakie udało mi się znaleźć.
źródło
Nie,
export function () { return answer; };
jest nieprawidłowy, albo używasz wartości domyślnej, albo dodajesz nazwę do tej deklaracji funkcji.Nie robią :)
Możesz zobaczyć wiele ważnych opcji tutaj: https://github.com/eslint/espree/pull/43
źródło