thinkphp 做门户网站,石家庄市网站制作价格,建设工程信息平台,佛山市南海区建设局网站typescript 类型断言
TypeScript 是一种在 JavaScript 基础上开发的强类型语言#xff0c;它为开发者提供了类型安全性和其他有用的特性。类型断言是 TypeScript 中的一种特性#xff0c;允许开发者在编译时确定变量或表达式的类型。类型断言有多种使用场景#xff0c;包括…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类型断言语法
Typeexpression
或者
expression as Type其中Type 是你要断言的类型expression 是你要进行类型断言的表达式。这两种语法是等价的可以根据个人喜好选择使用。
类型断言的使用
有了类型断言就可以解决上面的那个问题了,如下
使用as关键字实现类型断言关键字as后面的类型是一个更加具体的类型通过类型断言,aLink2的类型变得更加具体,这样就能正常的访问a标签的特有属性和方法了 当然,我们也可以使用第一种类型断言语法 ps:可能是因为我以前是由c入门的,所以个人更喜欢这种语法,不过大部分前端人员更喜欢上面那种写法 当然还有一个原因就是as原本就是一个关键字用来做变量别名的,不太喜欢二义性,
tips
谨慎使用类型断言。类型断言可能会导致运行时错误因为它会告诉 TypeScript 编译器“相信我我知道这个值是什么类型”。因此你应该在确实需要的时候才使用类型断言。在使用第三方库时尽可能地使用类型断言。由于 TypeScript 是强类型的而 JavaScript 库通常不是因此在将 JavaScript 库与 TypeScript 代码一起使用时就可能需要进行大量的类型断言。
