typescript 类型断言

typescript 类型断言

TypeScript 是一种在 JavaScript 基础上开发的强类型语言，它为开发者提供了类型安全性和其他有用的特性。类型断言是 TypeScript 中的一种特性，允许开发者在编译时确定变量或表达式的类型。类型断言有多种使用场景，包括处理第三方库、处理 DOM API 和处理其他 JavaScript 代码库。
说人话就是,当你比编译器还要明确的知道一个值的类型的时候,可以使用类型断言来指定更具体的类型

比如
当我们使用ts语法获取这个a标签时

如下,可以看到吗,不同的方法获取到的变量 ts类型推论也不一样,aLink1使用querySelector,这个方法返回文档中与指定选择器或选择器组匹配的第一个 Element对象。如果找不到匹配项，则返回null,
编译器能知道返回的是一个HTMLAnchorElement类型变量

但是aLink2不行,因为aLink2使用的是getElementById这个方法,

这个方法返回一个匹配特定 ID的元素。编译器就只能给一个HTMLElement类型的变量推论

tips:我们大多数时候还是更多使用getElementById方法,这是因为元素的 ID 在大部分情况下要求是独一无二的，这个方法自然而然地成为了一个高效查找特定元素的方法

但这样也就导致aLink2,返回的就是HTMLElement,这个类对象太过宽泛,

只包含所有标签的公共属性和方法,不包含a标签的特有属性href之类的

因为这种类型推论太过宽泛,无法让我们操作href等a标签的特有属性或方法,不利于开发

在这种情况下就需要使用类型断言来指定更加具体的类型,

ts类型断言语法

<Type>expression
或者
expression as Type

其中，Type 是你要断言的类型，expression 是你要进行类型断言的表达式。这两种语法是等价的，可以根据个人喜好选择使用。

类型断言的使用

有了类型断言就可以解决上面的那个问题了,如下

1. 使用as关键字实现类型断言
2. 关键字as后面的类型是一个更加具体的类型
3. 通过类型断言,aLink2的类型变得更加具体,这样就能正常的访问a标签的特有属性和方法了

当然,我们也可以使用第一种类型断言语法
ps:可能是因为我以前是由c入门的,所以个人更喜欢这种语法,不过大部分前端人员更喜欢上面那种写法
当然还有一个原因就是as原本就是一个关键字用来做变量别名的,不太喜欢二义性,

tips

1. 谨慎使用类型断言。类型断言可能会导致运行时错误，因为它会告诉 TypeScript 编译器：“相信我，我知道这个值是什么类型”。因此，你应该在确实需要的时候才使用类型断言。
2. 在使用第三方库时，尽可能地使用类型断言。由于 TypeScript 是强类型的，而 JavaScript 库通常不是，因此在将 JavaScript 库与 TypeScript 代码一起使用时，就可能需要进行大量的类型断言。