在TypeScript中，為什么使用as number后變量類型仍然是string？

typescript類型斷言：as number為何無效？

本文探討TypeScript中類型轉換的常見誤區，特別是as關鍵字的局限性。

場景重現

考慮如下代碼：

const props = defineProps()  getDictGroup(props.group)  export const getDictGroup = async (sid: number) => {   const dict = await getDict()   console.info(typeof sid); // 輸出可能為"String"   sid = sid as number;   console.info(typeof sid); // 輸出仍然可能為"string"   console.info(typeof (sid as number)); // 輸出仍然可能為"string" }

即使sid聲明為number類型，且使用了as number類型斷言，typeof sid仍然可能返回”string”。這并非as關鍵字失效，而是其作用機制導致的。

as關鍵字的本質

as關鍵字是TypeScript的類型斷言，它只在編譯時起作用，告訴編譯器“相信我，我知道我在做什么，這個值是這個類型”。它不會在運行時進行實際的類型轉換。

因此，如果props.group在運行時實際值為字符串，即使進行了as number斷言，其運行時類型仍然是字符串。typeof操作符在運行時檢查類型，所以結果仍然是”string”。 parseInt(sid) 編譯報錯是因為 TypeScript 在編譯階段根據類型推斷，認為 sid 是 number 類型，而 parseInt 期望的是 string 類型，兩者不匹配。

正確的類型轉換方法

要進行真正的運行時類型轉換，需使用JavaScript內置的類型轉換函數：

• 字符串轉數字: Number(sid), parseInt(sid, 10) (十進制)
• 數字轉字符串: String(sid)

修正后的代碼：

export const getDictGroup = async (sid: string | number) => { // 修改參數類型   const dict = await getDict()   let numSid: number;   if (typeof sid === 'string') {     numSid = parseInt(sid, 10); // 安全轉換，處理潛在錯誤     if (isNaN(numSid)) {       console.error("Invalid input: sid is not a valid number");       return; // 或拋出錯誤     }   } else {     numSid = sid;   }   console.info(typeof numSid); // 輸出 "number"   // ...后續代碼使用 numSid }

此版本首先檢查 sid 的類型，然后進行相應的轉換，并處理潛在的錯誤，例如字符串無法轉換為數字的情況。

總結

as關鍵字是類型斷言，僅用于編譯時類型檢查，不會改變運行時類型。 真正的類型轉換需要使用JavaScript的類型轉換函數，并注意處理潛在的運行時錯誤。 修改參數類型為 string | number 允許函數接受字符串或數字作為輸入，并進行相應的處理。 記住在進行類型轉換時添加錯誤處理機制，以確保代碼的健壯性。