Merge Interface

interface Document {
createElement(tagName: any): Element;
}
interface Document {
createElement(tagName: "div"): HTMLDivElement;
createElement(tagName: "span"): HTMLSpanElement;
}
interface Document {
createElement(tagName: string): HTMLElement;
createElement(tagName: "canvas"): HTMLCanvasElement;
}

在 TypeScript 中,上述三个 Document 接口此时会发生合并,因此在实际使用中,也需要合并使用三个 Document 的参数与结果。

var obj: Document = {
createElement: function (tagName: 'div' | 'span' | 'canvas') {
return {} as any
}
}

TypeScript 此时会根据传参自动帮助我们推导出结果的类型。

var result1 = obj.createElement('div') // HTMLDivElement
var result2 = obj.createElement('span') // HTMLSpanElement

link