Das export-Statement wird verwendet um funktionen und Objekte aus einer gegebenen Datei (oder Modul) zu exportieren.
Syntax
export { name1, name2, …, nameN }; export { variable1 as name1, variable2 as name2, …, nameN }; export let name1, name2, …, nameN; // also var export let name1 = …, name2 = …, …, nameN; // oder: var, const export default expression; export default function (…) { … } // oder: class, function* export default function name1(…) { … } // oder: class, function* export { name1 as default, … }; export * from …; export { name1, name2, …, nameN } from …; export { import1 as name1, import2 as name2, …, nameN } from …;
nameN
- Bezeichner der exportiert werden soll (damit er in einem anderen Script via
import
importiert werden kann).
Beschreibung
Es gibt zwei verschiedene Arten von Exports, die jeweils der oben angegebene Syntax entsprechen:
- Benannte Exports:
export { myFunction }; // exportiert eine Funktion, die zuvor deklariert wurde export const foo = Math.sqrt(2); // exportiert eine Konstante
- Default-Exports (nur einer je Script):
export default function() {} // oder 'export default class {}' // hier ist kein Semikolon
Benannte Exports sind nützlich um mehrere Werte zu exportieren. Beim Import kann man den selben Namen verwenden um auf den entsprechenden Wert zu verweisen.
Bezüglich Default-Export: es kann nur einen einzigen Default-Export pro Modul geben. Ein Default-Export kann eine Funktion sein, eine Klasse, ein Objekt oder irgendetwas anderes. Da dieser Wert am einfachsten importiert werden kann wird er als der "Haupt-Export" des Moduls angesehen.
Beispiele
Benannte Exports
Im Modul können wir den folgenden Code verwenden:
// Modul "my-module.js" export function cube(x) { return x * x * x; } const foo = Math.PI + Math.SQRT2; export { cube, foo };
Daraufhin könnten wir nun in einem anderen Script (cf. import
) wie folgt vorgehen:
import { cube, foo } from 'my-module'; console.log(cube(3)); // 27 console.log(foo); // 4.555806215962888
Standard-Export
Wenn wir nur einen einzelnen Wert exportieren wollen, oder um einen Fallback-Wert für unser Modul zu haben, könnten wir einen Default-Export verwenden:
// Modul "my-module.js" export default function cube(x) { return x * x * x; }
In einem anderen Script kann dieser Default-Export dann unkompliziert importiert werden:
import myFunction from 'my-module'; console.log(myFunction(3)); // 27
Spezifikationen
Spezifikation | Status | Kommentar |
---|---|---|
ECMAScript 2015 (6th Edition, ECMA-262) Die Definition von 'Exports' in dieser Spezifikation. |
Standard | Initiale Definition. |
ECMAScript 2017 Draft (ECMA-262) Die Definition von 'Exports' in dieser Spezifikation. |
Entwurf |
Browserkompatibilität
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt |
Siehe auch
import
- ES6 in Depth: Modules, Hacks Blog-Post von Jason Orendorff
- Axel Rauschmayer's Buch: "Exploring JS: Modules"