typescript 我想写一个示例是函数的类

5us2dqdw  于 2023-02-13  发布在  TypeScript
关注(0)|答案(2)|浏览(99)

在typescript中,我如何成功地创建一个示例是函数的类?具体来说,我希望类中的所有函数都返回一个HTML元素。
我希望在这个类中有这样的函数:

function givDiv() {
  const div = document.createElement('div')
  div.id = 'givenDiv'
  // other things I might want to do to div
  return div
}
ux6nzvsh

ux6nzvsh1#

是的,这是可能的。你可以使用类构造函数来返回你想要的元素。例如:

class MyDiv {
    constructor() {
        return document.createElement('div');
    }
}

用法:

const div = new MyDiv();

/* returns a <div></div> */

我不知道你的风景,但这可能是非常违反直觉的。你可以考虑使用静态方法。例如:

class CreateElement {
  static create(el, props) {
    return Object.assign(document.createElement(el), props);
  }
  
  static div(props = {}) {
    return CreateElement.create('div', props);
  }

  static p(props = {}) {
    return CreateElement.create('p', props);
  }
}

在这个类中,我们有一个泛型方法"create",它可以创建任何带有我们在"props"中指定的属性的元素。我们使用这个方法来创建专门的方法,这些方法可以为我们创建元素,如下所示:

const div = CreateElement.div();
/* creates a <div></div> */

const p = CreateElement.p({ classList: 'nice' });
/* creates a <p class="nice"></p> */
lsmepo6l

lsmepo6l2#

听起来你想创建一个类,它的 * 方法返回HTML元素 *(方法已经是函数了):

class MyClass {
    givDiv() {
        const div = document.createElement('div')
        div.id = 'givenDiv'
        // other things I might want to do to div
        return div
    }
}

const myInstance = new MyClass()
// `myInstance` is an instance of `MyClass`
const div = myInstance.givDiv()
// call the `givDiv` method on the instance, returning an HTMLDivElement

相关问题