ts之类型谓词

2021-01-01

在了解类型谓词之前,我们先来了解联合类型。

联合类型

日常开发中,我们会定义为一个支持多种类型的变量,比如一个变量可以是 sting 或者 number

let page: string | number = 1;

type Fish = {
  swim: () => void
};

type Bird = {
  fly: () => void
}

type Human = {
  swim?: () => void
  fly?: () => void
}

let animal: Fish | Bird | Human = ...;

类型保护

官方文档的描述

A type guard is some expression that performs a runtime check that guarantees the type in some scope.

类型保护主要的想法是尝试检测属性、方法或原型,以弄清楚如何处理一个值。有四种使用类型保护的主要方法,分别是 intypeofinstanceof,类型谓词

类型谓词

类型谓词是一种特殊的返回类型,它向Typescript编译器发出一个特定值是什么类型的信号。类型谓词总是附加到接受单个参数并返回布尔值的函数。类型谓词表示为 argumentName is Type

function isFish(pet: Fish | Bird): pet is Fish {
  return (pet as Fish).swim !== undefined;
}

这里的 pet is Fish 就是类型谓词,pet 必须是函数的参数

isFinis() 调用并且返回 true 的时候,ts就会把该变量的类型范围缩小为某一具体类型

let pet = getSmallPet();
 
if (isFish(pet)) {
  // isFinish为true,那么pet就是Fish
  pet.swim();
} else {
  pet.fly();
}
本文为原创,未经授权,禁止任何媒体或个人自媒体转载
商业侵权必究,如需授权请联系340443366@qq.com

评论

Loading...

最新评论

相关推荐

前端登录凭证存储方案
现在是前后端分离时代,接口登录凭证通常使用cookie,session,web storage来实现,三种方法区别可以阅...
React17.0生命周期调整
在即将到来的react17.0版本,react团队对生命周期做了调整,将会移除 componentWillMount,c...
ES6装饰器的应用
什么是装饰器 装饰器(Decorator)函数,是用来修改类的行为,一个装饰器函数有三个参数 target 装饰...
scroll-top-icon