547 Stimmen

ES6 Klassenvariablen-Alternativen

Aktuell verwenden viele von uns in ES5 das folgende Muster in Frameworks, um Klassen und Klassenvariablen zu erstellen, was bequem ist:

// ES 5
FrameWork.Class({

    variable: 'string',
    variable2: true,

    init: function(){

    },

    addItem: function(){

    }

});

In ES6 können Klassen nativ erstellt werden, es gibt jedoch keine Option für Klassenvariablen:

// ES6
class MyClass {
    const MY_CONST = 'string'; // <-- dies ist in ES6 nicht möglich
    constructor(){
        this.MY_CONST;
    }
}

Leider funktioniert das oben genannte nicht, da Klassen nur Methoden enthalten können.

Ich verstehe, dass ich this.myVar = true im constructor verwenden kann ... aber ich möchte meinen Konstruktor nicht 'verunreinigen', besonders wenn ich 20-30+ Parameter für eine größere Klasse habe.

Ich habe über viele Möglichkeiten nachgedacht, dieses Problem zu lösen, aber noch keine guten gefunden. (Zum Beispiel: Erstellen eines ClassConfig-Handlers und Übergeben eines parameter-Objekts, das separat von der Klasse deklariert wird. Dann würde der Handler an die Klasse angehängt werden. Ich habe auch über die Integration von WeakMaps nachgedacht.)

Welche Ideen hätten Sie, um mit dieser Situation umzugehen?

0voto

Steve Childs Punkte 1745

Der Weg, wie ich das gelöst habe, was eine andere Option ist (wenn Sie jQuery verfügbar haben), war es, die Felder in einem alten Objekt zu definieren und dann die Klasse mit diesem Objekt zu erweitern. Ich wollte auch den Konstruktor nicht mit Zuweisungen überfüllen, das schien mir eine ordentliche Lösung zu sein.

function MyClassFields(){
    this.createdAt = new Date();
}

MyClassFields.prototype = {
    id : '',
    type : '',
    title : '',
    createdAt : null,
};

class MyClass {
    constructor() {
        $.extend(this,new MyClassFields());
    }
};

-- Update nach Bergis Kommentar.

Keine JQuery-Version:

class SavedSearch  {
    constructor() {
        Object.assign(this,{
            id : '',
            type : '',
            title : '',
            createdAt: new Date(),
        });

    }
}

Sie landen immer noch mit einem 'fetten' Konstruktor, aber zumindest ist alles in einer Klasse und wird auf einmal zugewiesen.

EDIT #2: Ich bin nun wieder zum Ausgangspunkt zurückgekehrt und weise nun Werte im Konstruktor zu, z.B.

class SavedSearch  {
    constructor() {
        this.id = '';
        this.type = '';
        this.title = '';
        this.createdAt = new Date();
    }
}

Warum? Ganz einfach, mit dem oben genannten plus einigen JSdoc-Kommentaren konnte PHPStorm die Code-Vervollständigung für die Eigenschaften durchführen. Alle Variablen auf einmal zuzuweisen war schön, aber die Unfähigkeit, die Eigenschaften im Code zu vervollständigen, ist meiner Meinung nach den (wohl kaum vorhandenen) Leistungsvorteil nicht wert.

-1voto

TroyWorks Punkte 411

Dies ist eine etwas hackish Kombination aus statisch und get, die für mich funktioniert

class KonstanteSache{
        static get NICHT_ERNEUT__INIT() {
            if(KonstanteSache._NICHT_ERNEUT__INIT== null){
                KonstanteSache._NICHT_ERNEUT__INIT = new KonstanteSache(false,true);
            }
            return KonstanteSache._NICHT_ERNEUT__INIT;
        }
}

anderweitig verwendet

var conf = KonstanteSache.NICHT_ERNEUT__INIT;
if(conf.init)...

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X