17

ES6 を使用してオブジェクト ファクトリを作成したいのですが、古いスタイルの構文は新しいものでは機能しません。

次のコードがあります:

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 throw error
    }
}

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

私は何を間違っていますか？

4

6 に答える 6

10

それを行うための小さくて汚い方法があります：

function createClassByName(name,...a) {
    var c = eval(name);
    return new c(...a);
}

次のようなクラスを作成できます。

let c = createClassByName( 'Person', x, y );
于 2016-10-16T10:33:53.450 に答える
4

問題は、クラスがウィンドウ オブジェクトのプロパティではないことです。代わりに、クラスを「指す」プロパティを持つオブジェクトを持つことができます。

class Column {}
class Sequence {}
class Checkbox {}
let classes = {
  Column,
  Sequence,
  Checkbox 
}

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 classes[className](name); // this line no longer throw error
    }
}

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

export {ColumnFactory, Column, Sequence, Checkbox};
于 2015-08-02T22:03:26.310 に答える
1

これが古い投稿であることは知っていますが、最近、クラスを動的にインスタンス化する方法について同じ質問がありました

私はwebpackを使用しているので、ドキュメントに従ってimport()関数を使用してモジュールを動的にロードする方法があります

js/classes/MyClass.js

class MyClass {
    test = null;
    constructor(param) {
        console.log(param)
        this.test = param;
    }
}

js/app.js

var p = "example";
var className = "MyClass";

import('./classes/'+className).then(function(mod) {
    let myClass = new mod[className](p);
    console.log(myClass);
}, function(failMsg) {
    console.error("Fail to load class"+className);
    console.error(failMsg);
});

注意:このメソッドは非同期であり、パフォーマンス コストについてはわかりませんが、私の単純なプログラムでは完全に機能します (試してみる価値はあります ^^)

Ps :私は Es6 を初めて使いました (数日)。私は C++ / PHP / Java の開発者です。

これがこの質問に出くわした人の助けになることを願っています。それは悪い習慣ではありません^^".

于 2020-03-22T16:55:47.923 に答える