TypeScript - 型別斷言



型別斷言是 TypeScript 中的一種機制,用於告知編譯器變數的型別。如果 TypeScript 發現賦值錯誤,我們可以使用型別斷言覆蓋型別。我們必須確定自己是正確的,因為當我們使用型別斷言時,賦值始終是合法的。如果不是,我們的程式可能無法正常工作。

型別斷言的功能類似於型別轉換,但與 C# 和 Java 不同,它不執行型別檢查或資料重新排列。型別轉換提供了執行時支援,而型別斷言不影響執行時。型別斷言僅僅是一個編譯時構造,用於向編譯器提供有關我們希望如何檢查程式碼的指示。

如何執行型別斷言?

型別斷言是 Typescript 中的一種技術,它告訴編譯器變數的型別。儘管型別斷言不會重新建立程式碼,但型別轉換會。您可以使用型別斷言告訴編譯器不要推斷值型別。我們使用型別斷言將變數從一種型別轉換為另一種型別,例如將 any 轉換為數字。要執行型別斷言,我們可以使用 "<>" 運算子或 "as" 運算子。型別轉換提供執行時支援,而型別斷言對執行時沒有影響。在 TypeScript 中執行型別斷言有三種方法,它們是

  • 使用 as 運算子
  • 使用 <> 運算子
  • 使用物件

使用 as 運算子進行型別斷言

TypeScript 中的 as 關鍵字提供了一種顯示型別斷言的方法。

語法

let variable_any: any = 123
let variable_number: number = variable_any as number

在上面的語法中,我們對任何型別變數使用了 "as" 關鍵字進行型別斷言。

示例

let variable_unknown: unknown = "Tutorialspoint";
console.log("variable_unknown value is: ", variable_unknown);
let variable_number: number = (variable_unknown as string).length;
console.log("Length of variable_unknown: ", variable_number);

編譯後,它將生成以下 JavaScript 程式碼

var variable_unknown = "Tutorialspoint";
console.log("variable_unknown value is: ", variable_unknown);
var variable_number = variable_unknown.length;
console.log("Length of variable_unknown: ", variable_number);

輸出將是

variable_unknown value is: Tutorialspoint
Length of variable_unknown: 14

使用 <> 運算子進行型別斷言

<> 運算子是另一種在 TypeScript 中執行型別斷言的方法。

語法

let variable_any: any = 123
let variable_number: number = <number> variable_any

在上面的語法中,我們對任何型別變數使用了 "<>" 運算子進行型別斷言。

示例

let my_number: unknown = 12345
console.log('my_number value is: ', my_number)
let num: number = <number>my_number
console.log('typeof num is: ', typeof num)

編譯後,它將生成以下 JavaScript 程式碼

var my_number = 12345;
console.log('my_number value is: ', my_number);
var num = my_number;
console.log('typeof num is: ', typeof num);

輸出將是

my_number value is: 12345
typeof num is: number

使用物件進行型別斷言

物件是另一種執行型別斷言的方法,與 "as" 和 "<>" 運算子不同;物件可以一次用於多個型別斷言。

語法

interface info {
   name: string,
   value: string
}
let my_obj = <info> { name: 'ABC', value: 'abc'}

在上面的語法中,我們使用物件執行型別斷言。

示例

interface info {
   name: string
   value: string
}
let my_obj = <info>{}
my_obj.name = 'Tutorialspoint'
my_obj.value = 'typescript'
console.log(my_obj)

編譯後,它將生成以下 JavaScript 程式碼

var my_obj = {};
my_obj.name = 'Tutorialspoint';
my_obj.value = 'typescript';
console.log(my_obj);

輸出將是

{ name: 'Tutorialspoint', value: 'typescript' }
廣告