TypeScript 教程
/ 類(lèi)型轉(zhuǎn)換
類(lèi)型轉(zhuǎn)換
使用 as 進(jìn)行類(lèi)型轉(zhuǎn)換
一種直接的類(lèi)型轉(zhuǎn)換方法是使用 as
關(guān)鍵字,這將直接改變給定變量的類(lèi)型。
實(shí)例
let x: unknown = 'hello'; console.log((x as string).length);
類(lèi)型轉(zhuǎn)換實(shí)際上并不會(huì)改變變量?jī)?nèi)部數(shù)據(jù)的類(lèi)型,例如,以下代碼將無(wú)法按預(yù)期工作,因?yàn)樽兞?x 仍然包含一個(gè)數(shù)字。
let x: unknown = 4; console.log((x as string).length); // 打印 undefined,因?yàn)閿?shù)字沒(méi)有長(zhǎng)度
TypeScript 仍然會(huì)嘗試進(jìn)行類(lèi)型檢查以防止看似不正確的類(lèi)型轉(zhuǎn)換,例如,以下將拋出類(lèi)型錯(cuò)誤,因?yàn)?TypeScript 知道在不轉(zhuǎn)換數(shù)據(jù)的情況下,將字符串轉(zhuǎn)換為數(shù)字是沒(méi)有意義的:
console.log((4 as string).length); // 錯(cuò)誤:將類(lèi)型“number”轉(zhuǎn)換為類(lèi)型“string”可能是一個(gè)錯(cuò)誤,因?yàn)閮煞N類(lèi)型之間沒(méi)有足夠的重疊。如果這是有意的,請(qǐng)首先將表達(dá)式轉(zhuǎn)換為“unknown”。
下面的“強(qiáng)制類(lèi)型轉(zhuǎn)換”部分介紹了如何重寫(xiě)這一點(diǎn)。
使用 <> 進(jìn)行類(lèi)型轉(zhuǎn)換
使用 <>
與使用 as
進(jìn)行類(lèi)型轉(zhuǎn)換的效果相同。
實(shí)例
let x: unknown = 'hello'; console.log((<string>x).length);
這種類(lèi)型的類(lèi)型轉(zhuǎn)換在 TSX 中不起作用,例如在處理 React 文件時(shí)。
強(qiáng)制類(lèi)型轉(zhuǎn)換
為了重寫(xiě) TypeScript 在進(jìn)行類(lèi)型轉(zhuǎn)換時(shí)可能拋出的類(lèi)型錯(cuò)誤,請(qǐng)首先將類(lèi)型轉(zhuǎn)換為 unknown
,然后再轉(zhuǎn)換為目標(biāo)類(lèi)型。
實(shí)例
let x = 'hello'; console.log(((x as unknown) as number).length); // x 實(shí)際上不是一個(gè)數(shù)字,所以這將返回 undefined