Bagaimana untuk Menghidupkan Objek Secara Dinamik dalam JavaScript ES6?

Pemasangan Objek Dinamik dalam JavaScript ES6

Pernyataan Masalah

Mencipta objek daripada nama kelas menggunakan sintaks gaya lama dalam ES6 menyebabkan ralat. Kod berikut menimbulkan ralat:

let className = this.specColumn[name] ? this.specColumn[name] : this.specColumn['__default'];
return new window[className](name);

Penyelesaian

Untuk menyelesaikan isu, alih keluar nama kelas daripada objek yang ditentukan dan sebaliknya gunakan kelas itu sendiri. Ini menghapuskan pergantungan pada akses global melalui objek tetingkap. Selain itu, kilang boleh dipermudahkan kepada objek, kerana ia biasanya dibuat seketika sahaja.

Pembetulan Kod

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

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

Kod ini menyimpan kelas terus dalam objek specColumn, membolehkan dinamik instantiasi objek menggunakan kaedah cipta.

Atas ialah kandungan terperinci Bagaimana untuk Menghidupkan Objek Secara Dinamik dalam JavaScript ES6?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!