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; // oder: 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"
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 einen Fallback-Wert für unser Modul zur Verfügung haben möchten, können 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 Latest Draft (ECMA-262)
Die Definition von 'Exports' in dieser Spezifikation.
Entwurf  

Browserkompatibilität

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidEdge MobileFirefox für AndroidOpera für AndroidiOS SafariSamsung InternetNode.js
Grundlegende UnterstützungChrome Vollständige Unterstützung 61Edge Vollständige Unterstützung 16
Vollständige Unterstützung 16
Vollständige Unterstützung 15
Deaktiviert
Deaktiviert From version 15: this feature is behind the Experimental JavaScript Features preference.
Firefox Vollständige Unterstützung 60
Vollständige Unterstützung 60
Keine Unterstützung 54 — 60
Deaktiviert
Deaktiviert From version 54 until version 60 (exclusive): this feature is behind the dom.moduleScripts.enabled preference. To change preferences in Firefox, visit about:config.
IE Keine Unterstützung NeinOpera Vollständige Unterstützung 47Safari Vollständige Unterstützung 10.1WebView Android Keine Unterstützung NeinChrome Android Vollständige Unterstützung 61Edge Mobile Vollständige Unterstützung JaFirefox Android Vollständige Unterstützung 60
Vollständige Unterstützung 60
Keine Unterstützung 54 — 60
Deaktiviert
Deaktiviert From version 54 until version 60 (exclusive): this feature is behind the dom.moduleScripts.enabled preference. To change preferences in Firefox, visit about:config.
Opera Android Vollständige Unterstützung 47Safari iOS Vollständige Unterstützung 10.1Samsung Internet Android Keine Unterstützung Neinnodejs ?

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Keine Unterstützung  
Keine Unterstützung
Kompatibilität unbekannt  
Kompatibilität unbekannt
Benutzer muss dieses Feature explizit aktivieren.
Benutzer muss dieses Feature explizit aktivieren.

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

Zuletzt aktualisiert von: hoelzlmanuel,