Heim > Web-Frontend > js-Tutorial > Export const vs. export default in ES6: Wann sollte welche verwendet werden?

Export const vs. export default in ES6: Wann sollte welche verwendet werden?

Mary-Kate Olsen
Freigeben: 2024-11-30 01:15:18
Original
626 Leute haben es durchsucht

Export const vs. export default in ES6: When to Use Which?

Vergleich von Export-Konstante und Export-Standard in ES6

In ES6 ermöglicht das Exportieren und Importieren von Modulen die Organisation und Wiederverwendbarkeit des Codes. Zwei gängige Exportsyntaxen sind „export const“ und „export default“. Während beide dem Zweck dienen, Werte zu exportieren, haben sie unterschiedliche Eigenschaften und Anwendungsfälle.

export const (Benannter Export)

export const exportiert eine benannte Variable oder Konstante und ermöglicht so mehrere benannte Exporte aus einem einzelne Datei. Um benannte Exporte zu importieren, müssen bestimmte Namen in geschweiften Klammern angegeben werden:

// export named variables
export const myItem1 = "item1";
export const myItem2 = "item2";
Nach dem Login kopieren
// import named exports
import { myItem1, myItem2 } from "myModule";
Nach dem Login kopieren

Standardexport (Standardexport)

Standardexport exportiert einen einzelnen Standardwert aus einer Datei. Beim Importieren des Standardexports kann ein benutzerdefinierter Name zugewiesen werden:

// export default value
export default "Default Value";
Nach dem Login kopieren
// import default export as custom name
import CustomDefaultName from "myModule";
Nach dem Login kopieren

Verwendung und Unterschiede

Der Hauptunterschied zwischen export const und export default liegt in ihren Verwendungsszenarien:

  • Wann sollte export const verwendet werden: Beim Exportieren mehrerer benannter Werte aus einer Datei, z Konstanten, Klassen oder Funktionen.
  • Wann Exportstandard verwendet werden soll: Beim Exportieren eines einzelnen Standardwerts oder der Hauptfunktionalität eines Moduls, z. B. einer Komponente oder eines Dienstprogramms.

Namespace-Import

Zusätzlich zu benannten und Standardimporten ist es möglich, alle Exporte aus einer Datei mithilfe des Namespace-Imports zu importieren Syntax:

import * as myModule from "myModule";
Nach dem Login kopieren

Dies importiert alle exportierten Werte in das myModule-Objekt und ermöglicht den Zugriff auf benannte Exporte mit Punktnotation.

Hinweise

  • Standardexporte können sein Beim Import mit geschweiften Klammern benannt: { default as myDefault }.
  • Trotz des Namens „default“, default Exporte sind immer noch benannte Exporte und können mit bestimmten Namen importiert werden.
  • Standardexporte sind in der Syntax etwas prägnanter, sind aber möglicherweise nicht immer für jeden Anwendungsfall geeignet.

Das obige ist der detaillierte Inhalt vonExport const vs. export default in ES6: Wann sollte welche verwendet werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage