如果您在 javascript 中有一个类的名称字符串，如何访问该类？

Question

在 javascript 中，如果我有 2 个字符串 myApp 和 my-app 并被告知 myApp 实际上是扩展 HTMLElement 的类的名称，而 my-app 是该类的标记名，我该怎么做使用 JavaScript 来验证（假设该类已经定义）？

如果确实已经定义，基本上测试应该通过

class myApp extends HTMLElement {
    constructor() {
        super();
    }
}

customElements.define('my-app', myApp); 

基本上，它需要检查 myApp 是一个类并且确实扩展了 HTMLElement（尽管它可能会扩展其他东西，例如 Polymer.Element 等，但最终，它必须扩展 @987654330 @)。

其次，它必须检查my-app是那个类的标签名。

如何在 javascript 中做到这一点？

我试过eval("myApp")，但没用。

Answer 1

您可以使用customElements.get() 从标签名称中获取自定义元素类。

class myApp extends HTMLElement {
  constructor() {
    super()
  }
}
customElements.define( 'my-app', myApp )

console.log( customElements.get( 'my-app' ) === myApp )  //true

Answer 2

好吧，我想通了，我可以做

    var worked = false;
    var claimedClassName = 'myApp';
    var claimedElementName = 'my-app'; 

    try {
        const r = new Function(`return ${claimedClassName}`)();
        if (!(r.prototype instanceof HTMLElement)) {
            throw new Error('Class is not instance of HTMLElement');
        }
        var a = new r();
        if (a.tagName.toLowerCase() != claimedElementName.toLowerCase()) {
            throw new Error('Tagname does not match');
        }
        worked = true;
    } catch (err) {
        alert(err.message + "\n" + err.stack);
    }

    if (worked) alert("pass!")
    else alert("fail!");

Answer 3

要检查class 是否存在并且extends HTMLElement 应该在与class 相同的范围内执行检查，方法是尝试使用const 声明myApp，这应该抛出一个@ 987654327@或使用console.assert()。

验证第一部分后，您可以创建元素并检查创建元素的.is 属性或.tagName。

class myApp extends HTMLElement {
    constructor() {
        super();
    }
}

customElements.define('my-app', myApp); 

// string
let str = "myApp";
// get the object, if the object exists
const myApp_ = new Function(`return ${str}`)();
// check if `myApp` exists
console.assert(myApp_ === void 0
, myApp_
, [`${myApp_} is defined`
  , new RegExp(`${str} extends HTMLElement`).test(`${myApp_}`)]);