ネイティブ サポートなしで ES6 でクラス変数を定義するにはどうすればよいですか?

ES6 クラス変数の代替

ES5 では、クラス変数は一般に FrameWork.Class() パターンを使用して定義されました。ただし、ES6 では、クラス宣言はクラス変数をネイティブにサポートしません。

なぜ省略されているのですか?

ES6 ではクラス変数が存在しないのは意図的です。 TC39 は、クラス宣言をメンバー定義から分離することを目的としていました。クラス定義ではクラスの機能を定義する必要がありますが、メンバー (変数とメソッドの両方) は別の場所で定義する必要があります。

コンストラクターの代替

クラス変数を定義するための 1 つのオプションは、コンストラクター内で変数を割り当てることです。

constructor() {
    this.MY_VAR = true;
}

ただし、これにより、特に多くのクラスの場合、コンストラクターが乱雑になる可能性がありますパラメータ。

ES7 提案

提案された ES7 機能「プロパティ初期化子」は、クラス宣言と式でインスタンス変数を定義するためのより簡潔な構文を提供します。

class MyClass {
    foo = bar;
}

クラス構成ハンドラー

別のアプローチは、クラス構成を作成することです。初期化中にクラスに変数をアタッチするハンドラー。たとえば、WeakMap を使用する場合:

const classConfig = new WeakMap();
class ConfiguredClass {
    constructor() {
        const config = classConfig.get(this.constructor);
        if (config) {
            for (const [key, value] of Object.entries(config)) {
                this[key] = value;
            }
        }
    }
}

class MyConfiguredClass extends ConfiguredClass {}
classConfig.set(MyConfiguredClass, {
    variable: 'string',
    variable2: true
});

Babel と TypeScript のサポート

Babel と TypeScript は両方とも、クラス変数を定義するための構文を提供します:

// Babel
class MyClass {
    varName = value;
}

// TypeScript
class MyClass {
    varName: string = value;
}

以上がネイティブ サポートなしで ES6 でクラス変数を定義するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。