Typescript 回調類型檢查

Question

最近開始學習Typescript，遇到了這個概念上看不懂的問題。 給這個function定義參數類型有錯嗎？

setTimeout((a: string) => {
    console.log(a); // ==> Prints 5 as a number
}, 1, 5);

為什么調用回調時不進行類型檢查？

我將如何 go 關於使 typescript 引發錯誤？

遇到這樣的事情時，我的一般解決方案是什么？

Answer 1

這是 TypeScript 中的一個已知錯誤，請參閱microsoft/TypeScript#32186 。 setTimeout()的類型看起來像

setTimeout(handler: TimerHandler, timeout?: number, ...arguments: any[]): number;

它接受任何參數列表，而不關心類型。 而TimerHandler被定義為

type TimerHandler = string | Function

它使用不安全和無類型的Function類型。 因此，不幸的是， setTimeout()在 TypeScript 中的輸入非常松散。 通常在這種情況下，您可以使用聲明合並來添加更好的調用簽名，但在這種情況下，沒有什么可以阻止編譯器回退到不安全的調用簽名。

這似乎只是 TS 中的一個限制。 該問題被列為“積壓”，因此不會很快得到解決。 您可以將 go 發送給 microsoft/TypeScript#32186 並給它一個並顯示對它的修復的支持，但它不太可能發生太大變化。

目前只有解決方法。

您可以決定使用您自己的lib.dom.ts庫的本地副本，您可以在其中修改safeTimeout()的定義，但維護起來會非常煩人。

您可以使用的一種解決方法是將setTimeout包裝在您自己的 function 中，它的類型更強，然后只使用它可能是這樣的：

const safeSetTimeout: <A extends any[]>(
    handler: (...args: A) => void, timeout?: number, ...args: A
) => number = setTimeout;

這使用generics來強類型化handler回調所期望的args與傳遞給setTimeout()本身的args相同。 讓我們看看它的工作原理：

safeSetTimeout((a: string) => {
    console.log(a);
}, 1, 5); // <-- error!  number is not assignable to string
//    ~

太好了，我們在5上得到了預期的編譯器錯誤，說它應該是一個string而不是一個number 。 不幸的是，這與現在一樣好。