TypeScript 断言总结

您所在的位置：网站首页 › typescript尖括号 › TypeScript 断言总结

TypeScript 断言总结

2023-12-27 03:49| 来源: 网络整理| 查看: 265

1. 类型断言

在使用 TypeScript 的过程中，你可能会遇到这种情况：你比 TypeScript 更加清楚某个值的类型。比如你从异步请求中拿到一个类型为any的值，但你清楚的知道这个值就是string类型，这个时候你可以通过类型断言方式告诉编译器："嘿！相信我，我知道我在干什么！"。类型断言有点类似于其他语言的类型转换，但它没有运行时的影响，只是在编译阶段起作用。类型断言有两种形式：

1.1 尖括号语法形式：变量名 let value: any = "this is a string"; let length: number = (value).length; 1.2 as 语法形式：变量名 as 类型 let value: any = "this is a string"; let length: number = (value as string).length; 2. 非空断言

当你明确知道某个值不可能为 undefined 和 null 时，你可以用在变量后面加上一个 !（非空断言符号）来告诉编译器："嘿！相信我，我确信这个值不为空！"。非空断言具体的使用场景如下：

function fun(value: string | undefined | null) { const str: string = value; // error value 可能为 undefined 和 null const str: string = value!; //ok const length: number = value.length; // error value 可能为 undefined 和 null const length: number = value!.length; //ok } 3. 确定赋值断言

TypeScript 的确定赋值断言，允许在实例属性和变量声明后面放置一个 ! 号，从而告诉 TypeScript 该属性会被明确地赋值。

let name!: string;

上述表达式就是对编译器说："有一个名为 name 的属性，其类型为 string | undefined。它以值 undefined 开始。但每次获取或设置该属性时，我都希望将其视为类型 string。"

为了更好地理解它的作用，我们来看个具体的例子：

let count: number; initialize(); // Variable 'count' is used before being assigned.(2454) console.log(2 * count); // Error function initialize() { count = 10; }

很明显该异常信息是说变量 count 在赋值前被使用了，要解决该问题，我们可以使用确定赋值断言：

let count!: number; initialize(); console.log(2 * count); // Ok function initialize() { count = 10; } 4.参考文章 TypeScript 中文手册一份不可多得的 TS 学习指南

【本文地址】

TypeScript 断言总结

TypeScript 断言总结

今日新闻

推荐新闻