ホームページ  >  記事  >  ウェブフロントエンド  >  ES6 を使用して JavaScript でクラス名からオブジェクトを作成する方法

ES6 を使用して JavaScript でクラス名からオブジェクトを作成する方法

Barbara Streisand
Barbara Streisandオリジナル
2024-11-23 09:53:31559ブラウズ

How to Create an Object from a Class Name in JavaScript Using ES6?

JavaScript ECMAScript 6 でクラス名からオブジェクトを作成

Q: ES6 を使用してオブジェクト ファクトリを作成しようとしていますが、古い-style 構文は新しい構文では機能しません。次のコードがあります:

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 throws an error
    }
}

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

何が間違っていますか?

A: オブジェクトにクラス名を付ける必要はありません。代わりに、クラス自体をそこに配置して、クラスがグローバルであり、window オブジェクトを通じて (ブラウザで) アクセスできることに依存する必要がなくなるようにします。

さらに、ファクトリをクラスにする理由はありません。おそらく 1 回だけインスタンス化します (シングルトン)。代わりにオブジェクトにすることもできます:

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);
    }
};

以上がES6 を使用して JavaScript でクラス名からオブジェクトを作成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。