Geschweifte Klammern in ES6-Einzelmodulimporten: Wann sollte man sie verwenden und wann nicht?

Wann sind geschweifte Klammern für ES6-Einzelmodulimporte zu verwenden?

In ES6 kann die Verwendung von geschweiften Klammern für den Import eines einzelnen Moduls zu unerwartetem Verhalten führen. Um zu verdeutlichen, wann geschweifte Klammern verwendet und vermieden werden sollten, untersuchen wir den Unterschied zwischen Standard- und benannten Exporten.

Standardexport

Beim Importieren eines einzelnen Moduls ohne geschweifte Klammern Sie importieren im Wesentlichen den Standardexport. Standardexporte werden wie folgt deklariert:

export default <value>;

Im bereitgestellten Beispiel enthält initialState.js einen Standardexport für das initialState-Objekt. Daher können Sie ohne geschweifte Klammern darauf zugreifen:

import initialState from './todoInitialState';

Benannter Export

Wenn Sie einen bestimmten exportierten Wert importieren müssen, sollten Sie geschweifte Klammern verwenden. Benannte Exporte werden wie folgt deklariert:

export const <identifier> = <value>;

Im TodoReducer.js-Beispiel versuchen Sie, auf die Aufgabe mit dem Namen export zuzugreifen:

import { todo } from './todoInitialState';

Mit geschweiften Klammern vs. Sie vermeiden

Als Faustregel gilt, beim Import benannter Exporte geschweifte Klammern zu verwenden und diese zu vermeiden beim Importieren von Standardexporten. Hier ist eine zusammengefasste Aufschlüsselung:

• Verwenden Sie geschweifte Klammern:

  • Beim Importieren eines bestimmten benannten Exports

• Vermeiden Sie Locken geschweifte Klammern:

  • Beim Importieren des Standardexports aus einem Modul mit nur einem Standardexport
  • Beim Importieren mehrerer Exporte aus einem Modul, unabhängig davon, ob es sich um Standardexporte oder benannte Exporte handelt Exporte

Beispiel

Betrachten Sie das folgende Beispiel:

// A.js
export default MyComponent;
export const ChildComponent = () => {};

So importieren Sie diese Exporte:

• Standardexport (MyComponent):

  import MyComponent from './A';

• Benannter Export (ChildComponent):

  import { ChildComponent } from './A';

Von Wenn Sie den Unterschied zwischen Standard- und benannten Exporten verstehen, können Sie richtig bestimmen, wann geschweifte Klammern für den Import einzelner Module in ES6 verwendet werden sollten.

Das obige ist der detaillierte Inhalt vonGeschweifte Klammern in ES6-Einzelmodulimporten: Wann sollte man sie verwenden und wann nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!