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' }
广告