typeScript-聯合型別
阿新 • • 發佈:2021-06-17
聯合型別
聯合型別表示取值可以取設定多種型別中的一種。
let myFavoriteNum:string|number
myFavoriteNum = 'seven'
myFavoriteNum = 7
myFavoriteNum = true
// TS2322: Type 'boolean' is not assignable to type 'string | number'.
聯合型別使用|分隔符來分隔每個型別
上面程式碼說明let myFavoriteNum:string|number
說明myFavoriteNum可以為string何number型別,但是不能為其他型別
訪問聯合型別的屬性和方法
當TypeScript不確定一個聯合型別的變數到底是那個型別的時候,我們只能訪問此聯合型別的所有型別裡共有的屬性和方法。
function getLength(something:string|number) {
return something.length
}
// Property 'length' does not exist on type 'string | number'.
// Property 'length' does not exist on type 'number'.
上述程式碼中,length不屬於string和number的共有屬性,所以會報錯
訪問string和number的共有屬性是沒有問題的
function getLength(something:string|number) {
return something.toString()
}
聯合型別的變數在被賦值的時候,會根據型別推論的規則來推斷出來一個型別
let myFavoriteNum:string|number myFavoriteNum = 'seven' console.log(myFavoriteNum.length) myFavoriteNum = 7 console.log(myFavoriteNum.length) // ERROR in :Property 'length' does not exist on type 'number'.
上例中,第二行的 myFavoriteNumber 被推斷成了 string,訪問它的 length 屬性不會報錯。
而第四行的 myFavoriteNumber 被推斷成了 number,訪問它的 length 屬性時就報錯了。