typescript類型推斷的微妙之處：四種類型定義的相同結果及條件類型與聯合類型的匹配難題
本文探討typescript中幾種看似不同的類型定義卻產生相同結果的原因，并解釋一個條件類型與聯合類型匹配的問題。
首先，我們分析四種getReturnType類型的定義：
type getReturnType1<T> = T extends (...args: never) => infer R ? R : never; type getReturnType2<T> = T extends (...args: never[]) => infer R ? R : never; type getReturnType3<T> = T extends (...args: any[]) => infer R ? R : never; type getReturnType4<T> = T extends (...args: any) => infer R ? R : never;
這四種類型定義都旨在從函數類型中推斷其返回值類型。盡管參數類型(…args: never)、(…args: never[])、(…args: any[])和(…args: any)看起來不同，但在類型推斷中卻表現一致。這是因為extends關鍵字主要關注函數的參數個數和返回值類型，而不會嚴格檢查參數類型的細節。never代表不可能存在的類型，any代表任何類型，never[]代表空數組；這些差異在返回值類型推斷過程中被忽略。因此，都能正確推斷出函數的返回值類型R。
接下來，我們分析一個條件類型與聯合類型不匹配的問題：
type Props<T extends Major | ResCategoryLabel> = { labels: T[]; setSelect: (index: number, label: T extends Major ? Major : ResCategoryLabel) => void; xxx; }; const changeSelect = ( index: number, label: Major | ResCategoryLabel, e: React.MouseEvent<HTMLAnchorElement> | React.TouchEvent<HTMLAnchorElement> ) => { setSelect(index, label); activeTabToCenter(e.currentTarget as HTMLElement); };
setSelect函數的第二個參數label的類型定義為T extends Major ? Major : ResCategoryLabel。問題在于，當T為Major | ResCategoryLabel時，TypeScript無法確定label的類型。條件類型試圖根據T是否為Major來選擇類型，但T可能是Major也可能是ResCategoryLabel，導致類型推斷無法給出確定的類型，從而出現類型不匹配錯誤。這不是代碼邏輯錯誤，而是TypeScript類型系統在處理聯合類型和條件類型時的限制。 解決方法可能需要重構Props類型或setSelect函數的類型定義，例如使用類型斷言或更精細的類型定義來明確label的類型。
? 版權聲明
文章版權歸作者所有，未經允許請勿轉載。
THE END
