五种在 TypeScript 中使用类型保护的方法

类型保护是一个执行运行时检查的表达式，以保证某个范围内的类型。类型保护的一个典型应用场景是缩小联合类型的类型范围。这是为了保证类型安全，即在运行时安全地访问特定类型对象中的特定属性或方法。,,在这篇文章中，我将介绍 5 种实现类型保护的方法。,首先我们来介绍一下比较常见的typeof类型防护。typeof 运算符可以在运行时获取对象的类型，该运算符返回以下可能的值：,因此使用 typeof 运算符，我们可以在运行时获取变量的实际类型。举个例子：,在上面的代码中，我们定义了一个 printId 函数，它包含一个 id 参数，其类型为字符串 | 数字联合类型。,在函数体中，我们使用 typeof 运算符来确定参数的实际类型。如果id参数是字符串类型，我们会将其值转换为大写后再输出。,那么为什么要使用 typeof 运算符来缩小 id 参数的类型呢？主要原因是为了保证运行时的类型安全。例如，当id参数的类型是数字类型时，但是我们调用id.toUpperCase()方法，就会抛出运行时异常。,在支持 TypeScript IntelliSense 的编辑器中，当您访问 id 参数的某些属性时，只能访问字符串和数字类型的公共属性。具体如下图所示：,虽然typeof运算符可以区分不同的类型，但如果我们想判断一个对象是否是某个类的实例，从而安全地访问该实例上特有的属性或方法，那么typeof运算符就无能为力了。,对于这个需求，我们可以使用instanceof运算符。再次，我们举一个具体的例子：,在上面的代码中，我们定义了一个Shape类，并基于它创建了两个子类。接下来，我们定义一个 printShapeInfo 函数来打印有关不同形状的信息：,在printShapeInfo函数体中，我们使用instanceof运算符来缩小形状参数的类型，从而输出不同形状的信息。在 if…else if 分支之外，我们只能访问 Circle 对象和 Square 对象共有的 id 属性。,对于前面使用instanceof运算符实现类型保护的示例，我们还可以使用接口的形式来描述Shape、Circle和Square类型。,由于TypeScript接口定义的类型在编译后并不会生成对应的类型，因此我们无法在运行时使用instanceof运算符进行类型检测。要实现printShapeInfo函数的功能，我们可以使用in运算符，具体实现如下：,除了上述方法之外，我们还可以使用可判别联合类型来表示Shape类型：,在Circle和Square类型中，type属性的类型是字符串文字类型，用于区分不同的形状，称为可区分属性。对于判别联合类型，结合switch…case语句，我们还可以实现printShapeInfo函数对应的功能。,介绍完如何使用常见的 typeof、instanceof 和 in 运算符实现类型保护之后，我们来介绍一下如何定义用户自定义的类型保护。,为了演示用户定义的类型保护，让我们重新定义 3 种类型：,定义完Shape相关的类型后，我们来定义用户自定义的类型保护函数：,与普通函数相比，自定义类型保护函数返回类型谓词。上面代码中的 shape is Circle 就是所谓的类型谓词。谓词采用parameterName is Type 的形式，其中parameterName 必须是当前函数签名中的参数名称。,这样就可以理解isCircle用户自定义类型保护函数的作用了。如果函数返回值为true，则shape参数的类型为Circle类型。,现在我们有了 isCircle 和 isSquare 函数，我们可以在 printShapeInfo 函数中使用它们，如下所示：,除了前面描述的 4 种类型保护方法之外，TypeScript 还支持使用 if/switch 语句和相等检查，例如 ===、!===、== 和 != 运算符来缩小变量的类型。,上面的代码中，printValues函数支持a和b 2个参数，并且它们的类型都是联合类型。当a===b表达式的计算结果为true时，参数a和b的类型将缩小为字符串类型。当然，使用!==运算符也可以用来实现类型缩小。,这就是关于 TypeScript 类型防护的全部内容。,以上就是我今天想与你分享的5个TS的知识技能，希望对你有所帮助。