如何在TypeScript中使用函數重載？

Question

給出以下TypeScript代碼

class NumberChecker { }
class StringChecker { }
class Component {}
class ComponentChecker { }
class Grid { }
class GridChecker { }

function check(element: number): NumberChecker;
function check(element: string): StringChecker;
function check(element: Grid): GridChecker;
function check(element: Component): ComponentChecker {
    if (typeof element === 'number') {
        return new NumberChecker();
    }
    if (typeof element === 'string') {
        return new StringChecker();
    }
    if (element instanceof Component) {
        return new ComponentChecker();
    }
    if (element instanceof Grid) {
        return new GridChecker();
    }
}

const a = check(2); // a is NumberChecker
const b = check('sdf'); // b is StringChecker
const c = check(new Component()); // c is GridChecker
const d = check(new Grid()); // d is GridChecker

為什么c和d都是GridChecker ？ 我期待c成為ComponentChecker 。

鏈接到游樂場

Answer 1

實際實現的簽名需要涵蓋所有選項，在您的情況下，它應該是：

function check(element: number): NumberChecker;
function check(element: string): StringChecker;
function check(element: Grid): GridChecker;
function check(element: Component): ComponentChecker;
function check(element: number | string | Grid | Component) {
    // ...
}

那么類型為：

const c = check(new Component());

是ComponentChecker 。

但同樣，只有不同的類不具有相同的結構。