Wie erstelle ich Objekte aus Klassennamen in ES6?

Erstellen von Objekten aus Klassennamen in JavaScript ES6

Beim Versuch, eine Objektfabrik in ES6 mit dem traditionellen alten- zu erstellen Bei der Stilsyntax kann es zu einem Fehler kommen. Dies liegt daran, dass die alte Syntax nicht mit der neuen ES6-Syntax kompatibel ist.

Im bereitgestellten Code-Snippet:

export class Column {}
export class Sequence {}
export class Checkbox {}

export class ColumnFactory {
    constructor() {
        this.specColumn = {
            __default: 'Column',
            __sequence: 'Sequence',
            __checkbox: 'Checkbox'
        };
    }

    create(name) {
        let className = this.specColumn[name] ? this.specColumn[name] : this.specColumn['__default'];
        return new window[className](name); // this line throw error
    }
}

let factory = new ColumnFactory();
let column = factory.create('userName');

< ;p>Der Fehler tritt in der Zeile return new window[className](name); auf. weil es versucht, auf den Klassennamen als globale Variable zuzugreifen. Dieser Ansatz schlägt in ES6 fehl, da Klassen nicht als globale Variablen verfügbar gemacht werden.

Lösung:

Um dieses Problem zu beheben, ersetzen Sie die Klassennamen im specColumn-Objekt mit den tatsächlichen Klassenreferenzen:

export class Column {}
export class Sequence {}
export class Checkbox {}

export const columnFactory = {
    specColumn: {
        __default: Column,    // <--
        __sequence: Sequence, // <--
        __checkbox: Checkbox  // <--
    },
    create(name, ...args) {
        let cls = this.specColumn[name] || this.specColumn.__default;
        return new cls(...args);
    }
};

Auf diese Weise sind Sie nicht mehr darauf angewiesen, dass Klassennamen global verfügbar sind, und können direkt auf Klassen zugreifen aus dem specColumn-Objekt.

Das obige ist der detaillierte Inhalt vonWie erstelle ich Objekte aus Klassennamen in ES6?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!