javascript - 从类名字符串实例化一个对象

Question

我正在尝试根据所选选项动态实例化 JS 对象。我的 HTML 看起来像

<select class="klass">
  <option value="Klass1">1</option>
  <option value="Klass2">2</option>
  <option value="Klass3">3</option>
</select>

这是我的 JS(到目前为止)

let elements = [1,2,3]
let klass_name = document.querySelector('.klass').value
let klass = new ???(elements)
console.log(klass.params())



export default class Klass1 {
  constructor(elements) {
    this.elements = elements
  }

  params() {
    return "lorem"
  }
}

export default class Klass2 {
  constructor(elements) {
    this.elements = elements
  }

  params() {
    return "ipsum"
  }
}

export default class Klass3 {
  constructor(elements) {
    this.elements = elements
  }

  params() {
    return "this is very comPLEex@"
  }
}

我应该用什么替换???？

如果我不必在 JS 中预定义所有可能的选项，那就太好了。

我不是试图更改类，而是实例化此类的对象。

Answer 1

它正在构建一个字典，您可以在其中从与要创建的类关联的选择中检索到值。因此 Klasses[klass_name] 返回您要创建的类。

const Klasses = {
  Klass1: class Klass1 {
    constructor(elements) {
      this.elements = elements
    }

    params() {
      return "1"
    }
  },
  Klass2: class Klass2 {
    constructor(elements) {
      this.elements = elements
    }

    params() {
      return "2"
    }
  }
};

let elements = [1, 2, 3]
let klass_name = document.querySelector('.klass').value
const klass = new Klasses[klass_name]();
console.log(klass.params());

<select class="klass">
  <option value="Klass1">1</option>
  <option value="Klass2">2</option>
  <option value="Klass3">3</option>
</select>