Bagaimanakah kita boleh menentukan pembolehubah kelas dalam ES6 tanpa sokongan asli?

Alternatif Pembolehubah Kelas ES6

Dalam ES5, pembolehubah kelas biasanya ditakrifkan menggunakan corak FrameWork.Class(). Walau bagaimanapun, dalam ES6, pengisytiharan kelas tidak menyokong pembolehubah kelas secara asli.

Mengapa Peninggalan?

Ketiadaan pembolehubah kelas dalam ES6 adalah disengajakan. TC39 bertujuan untuk memisahkan perisytiharan kelas daripada definisi ahli. Takrifan kelas harus mentakrifkan keupayaan kelas, manakala ahli (kedua-dua pembolehubah dan kaedah) harus ditakrifkan di tempat lain.

Alternatif Pembina

Satu pilihan untuk mentakrifkan pembolehubah kelas ialah menetapkannya dalam pembina:

constructor() {
    this.MY_VAR = true;
}

Walau bagaimanapun, ini boleh mengacaukan pembina, terutamanya dengan banyak kelas parameter.

Cadangan ES7

Ciri ES7 yang dicadangkan, "Property Initializers," menyediakan sintaks yang lebih ringkas untuk mentakrifkan pembolehubah contoh dalam pengisytiharan dan ungkapan kelas:

class MyClass {
    foo = bar;
}

Pengendali Konfig Kelas

Pendekatan alternatif ialah mencipta konfigurasi kelas pengendali yang melampirkan pembolehubah pada kelas semasa permulaan. Contohnya, menggunakan 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
});

Sokongan Babel dan TypeScript

Babel dan TypeScript kedua-duanya menyediakan sintaks untuk menentukan pembolehubah kelas:

// Babel
class MyClass {
    varName = value;
}

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

Atas ialah kandungan terperinci Bagaimanakah kita boleh menentukan pembolehubah kelas dalam ES6 tanpa sokongan asli?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!