Разные типы для возвращения у функции

Question

Как мне написать типы так, чтобы при вызове функции domUtils.create('img') - у меня возвращался тип HTMLImageElement ?

export const domUtils = {
  toArray<T>(element: T): T[] {
    return [].slice.call(element);
  },
  get(selector: string): HTMLElement {
    return document.querySelector(selector);
  },
  create(element: string): HTMLImageElement | HTMLElement {
        if (element === 'img') {
            return document.createElement(element) as HTMLImageElement;
        }
    return document.createElement(element) as HTMLElement;
  }
};

const imageNode = domUtils.create('img');

Answer 1

export const domUtils = {
  create<T extends keyof HTMLElementTagNameMap>(
    element: T
  ): HTMLElementTagNameMap[T] {
    return document.createElement(element);
  }
};

const imageNode = domUtils.create('img');

Да, я увидел это в lib.dom.d.ts, не подскажите, как самому такое сделать?

Воспользуйтесь перегрузкой функции, например, так:

function create(element: 'img'): HTMLImageElement;
function create(element: string): HTMLElement;
function create(element: string): HTMLElement {
  return document.createElement(element);
}

export const domUtils = {
  create,
};

const imageNode = domUtils.create('img');
const aNode = domUtils.create('a');

БЛОГ НА HUSL

Разные типы для возвращения у функции

Ответы (1 шт):