[javascript] Wann sollte ich geschweifte Klammern für den ES6-Import verwenden?



Answers

TL; DR : Curly-Klammern werden verwendet, wenn Sie einen nicht standardmäßigen Export importieren möchten.

Siehe Dan Abramovs Antwort oben für weitere Details.

Question

Es scheint offensichtlich zu sein, aber ich war etwas verwirrt darüber, wann ich geschweifte Klammern zum Importieren eines einzelnen Moduls in ES6 verwenden sollte. Im react-nativen Projekt, an dem ich gerade arbeite, habe ich zum Beispiel die folgende Datei und ihren Inhalt:

initialState.js :

var initialState = {
    todo: {
        todos: [
            {id: 1, task: 'Finish Coding', completed: false},
            {id: 2, task: 'Do Laundry', completed: false},
            {id: 2, task: 'Shopping Groceries', completed: false},
        ]
    }
};

export default initialState;

In der TodoReducer.js muss ich es ohne geschweifte Klammern importieren:

import initialState from './todoInitialState';

Wenn ich den initialState in geschweifte Klammern einschließen, initialState ich den folgenden Fehler für die folgende Codezeile:

Eigenschaftstodo von undefined kann nicht gelesen werden

TodoReducer.js :

export default function todos(state = **initialState.todo**, action) {
}

Ähnliche Fehler treten auch bei meinen Komponenten mit den geschweiften Klammern auf. Ich habe mich gefragt, wann ich geschweifte Klammern für einen einzelnen Import verwenden sollte, denn natürlich müssen Sie, wenn Sie mehrere Komponenten / Module importieren, diese in geschweifte Klammern einschließen, die ich kenne.

Bearbeiten :

Der SO-Beitrag here beantwortet meine Frage nicht, sondern ich frage, wann ich geschweifte Klammern zum Importieren eines einzelnen Moduls verwenden soll oder nicht, oder ich sollte nie geschweifte Klammern zum Importieren eines einzelnen Moduls in ES6 verwenden (dies ist offensichtlich nicht der Fall case, da ich einen einzelnen Import mit geschweiften Klammern benötigt habe)




Dan Abramov antwortet oben erklärt die Standard-Exporte und benannte Exporte .

Was zu verwenden?

Zitieren von David Herman : ECMAScript 6 bevorzugt den einzelnen / Standard-Export-Stil und bietet die süßeste Syntax zum Importieren des Standards. Das Importieren von benannten Exporten kann und sollte etwas weniger präzise sein.

In TypeScript wird der benannte Export jedoch wegen Refactoring bevorzugt. Beispiel: Wenn Sie eine Klasse standardmäßig exportieren und umbenennen, ändert sich der Klassenname nur in dieser Datei und nicht in den anderen Referenzen. Der benannte Exportklassenname wird in allen Referenzen umbenannt. Benannte Exporte werden auch für Dienstprogramme bevorzugt.

Gesamtgebrauch, was auch immer Sie bevorzugen.

Zusätzlich

Der Standard-Export ist eigentlich ein benannter Export mit Standardnamen, so dass der Standard-Export folgendermaßen importiert werden kann:

import {default as Sample} from '../Sample.js';



Links