TypeScript中的类型断言
本文是关于 TypeScript 中的 type assertions 的,它与其他语言中的类型强制转换有相似之处,并通过 as 运算符执行。
类型断言
类型断言使我们可以覆盖 TypeScript 为存储位置计算的静态类型,这对于解决类型系统的限制很有用。
类型断言与其他语言中的类型强制转换有相似之处,但是它们不会引发异常,并且在运行时也不做任何事情(它们确实会静态执行一些少量的检查)。
1const data: object = ['a', 'b', 'c']; // (A) 2 3// @ts-ignore: Property 'length' does not exist on type 'object'. 4data.length; // (B) 5 6assert.equal( 7 (data as Array<string>).length, 3); // (C)
-
在 A 行中,我们把 Array 的类型扩展为 object。
-
在 B 行中,我们看到此类型不允许访问任何属性。
- 在 C 行中,我们用类型断言(运算符 as)告诉 TypeScript data 是一个Array。现在就可以访问属性 .length 了。
类型断言是不得已的方法,应尽可能的避免。他们(暂时)删除了静态类型系统为我们提供的安全网。
注意,在 A 行中,我们还覆盖了 TypeScript 的静态类型,不过是通过类型注释完成的。这种覆盖方式比类型声明要安全得多,因为你可以做的事情少得多。TypeScript 的类型必须能够分配给注释的类型。
类型断言的替代语法
TypeScript 对于类型断言有另一种“尖括号”语法:
1<Array<string>>data
该语法已经过时,并且与 React JSX 代码(在 .tsx 文件中)不兼容。
示例:声明一个接口
为了访问任意对象 obj 的属性 .name,我们暂时将 obj 的静态类型更改为 Named(A行和B行)。
1interface Named { 2 name: string; 3} 4function getName(obj: object): string { 5 if (typeof (obj as Named).name === 'string') { // (A) 6 return (obj as Named).name; // (B) 7 } 8 return '(Unnamed)'; 9}
示例:声明索引签名
在以下代码中,我们在行 A 用了类型断言 as Dict ,以便可以访问其推断类型为 object 的值的属性。也就是说,用静态类型 Dict 覆盖了推断的静态类型 object。
1type Dict = {[k:string]: any}; 2 3function getPropertyValue(dict: unknown, key: string): any { 4 if (typeof dict === 'object' && dict !== null && key in dict) { 5 // %inferred-type: object 6 dict; 7 8 // @ ts-ignore:元素隐式具有“any”类型,因为 9 // 类型'string'的表达式不能用于索引类型'{}'。 10 // 在类型“ {}”上没有找到参数类型为'string'的索引签名。 11 dict[key]; 12 13 return (dict as Dict)[key]; // (A) 14 } else { 15 throw new Error(); 16 } 17}
与类型断言相关的构造
非空断言运算符(后缀 !
)
如果值的类型是包含 undefined 或 null 类型的联合,则 non-nullish声明运算符(或 non-null 声明运算符)将从联合中删除这些类型。我们告诉 TypeScript:“这个值不能是 undefined 或 null。”因此,我们可以执行这两个值的类型所阻止的操作,例如:
1const theName = 'Jane' as (null | string); 2 3// @ts-ignore: Object is possibly 'null'. 4theName.length; 5 6assert.equal( 7 theName!.length, 4); // OK
示例 – Maps: .has()
之后的 .get()
使用 Map 方法 .has() 之后,我们知道 Map 具有给定的键。遗憾的是,.get() 的结果不能反映这一点,这就是为什么我们必须使用 nullish 断言运算符的原因:
1function getLength(strMap: Map<string, string>, key: string): number { 2 if (strMap.has(key)) { 3 // We are sure x is not undefined: 4 const value = strMap.get(key)!; // (A) 5 return value.length; 6 } 7 return -1; 8}
由于 strMap 的值永远不会是 undefined,因此我们可以通过检查 .get() 的结果是否为 undefined 来检测丢失的 Map 条目(A 行):
1function getLength(strMap: Map<string, string>, key: string): number { 2 // %inferred-type: string | undefined 3 const value = strMap.get(key); 4 if (value === undefined) { // (A) 5 return -1; 6 } 7 8 // %inferred-type: string 9 value; 10 11 return value.length; 12}
定值断言
如果打开 strict 属性初始化,有时需要告诉 TypeScript 我们确实初始化某些属性——即使它认为我们不需要这样做。
这是一个例子,尽管 TypeScript 不应这样做,但它仍会报错:
1class Point1 { 2 // @ts-ignore: Property 'x' has no initializer and is not definitely 3 // assigned in the constructor. 4 x: number; 5 6 // @ts-ignore: Property 'y' has no initializer and is not definitely 7 // assigned in the constructor. 8 y: number; 9 10 constructor() { 11 this.initProperties(); 12 } 13 initProperties() { 14 this.x = 0; 15 this.y = 0; 16 } 17}
如果我们在 A 行和 B 行中使用“定值分配断言”(感叹号),则错误会消失:
1class Point2 { 2 x!: number; // (A) 3 y!: number; // (B) 4 constructor() { 5 this.initProperties(); 6 } 7 initProperties() { 8 this.x = 0; 9 this.y = 0; 10 } 11}
原文链接
- typeScript-基础知识-4-8类型断言
- TypeScript 类型断言
- 关于 Typescript 泛型、断言、解构、枚举
- typescript的never类型
- Swift基础语法(常量变量、数据类型、元组、可选、断言)
- TypeScript 学习笔记(一)---基本类型及变量声明
- 《TypeScript 中文入门教程》 1、基础数据类型
- TypeScript学习笔记(四)联合类型
- TypeScript入门-基本数据类型
- 09-go类型断言
- TypeScript入门-基本数据类型
- 从C#到TypeScript - 类型
- TypeScript基础类型
- GO语言类型转换和类型断言实例分析
- 从C#到TypeScript - 类型
- TypeScript的数组(引用类型)
- TypeScript基础入门 - 类型兼容性 - 比较两个函数
- 遨游TypeScript海洋之定义变量和数据类型
- TypeScript入门-高级类型
- 感受typescript定义变量和数据类型的神奇魔力