TypeScript类型守卫

概念

        在语句的块级作用域【if语句内或条目运算符表达式内】缩小变量类型的一种类型推断的行为。

        类型守卫可以帮助我们在块级作用域中获得更为需要的精确变量类型,从而减少不必要的类型断言。

  • 类型判断:typeof
  • 实例判断:instanceof
  • 字面量相等判断:=====!=!==

 类型判断(typeof)

function test(own: string | boolean | number) {if (typeof own === "string") {// 这里own的类型限制为string} else if (typeof own === "number") {// 这里 own 的类型限制为 number} else {// 这里的类型限制为 boolean}
}

很好理解吧,就像JS的typeof一样。但是两者还是有区别的。

typeof 类型保护只支持两种形式:

  1. typeof value === [typename]
  2. typeof value !== [typename]

这里"typename" 必须是 "number""string""boolean""symbol"

但是 TypeScript 并不会阻止你与其它字符串比较,只是语言不会把那些表达式识别为类型保护。

 转成JS几乎无区别。

虽然在类型判断里ts的typeof和js的typeof看起来没有区别。但是。ts的typeof用法与js的typeof用法存在蛮大的差异。具体可以看这篇推文。

实例判断instanceof (对typeof的补充)

js里也有instanceof。instance就是实例的意思,建议先看看JS里instanceof和typeof的区别。

在 TypeScript 中,使用 instanceof 操作符可以检查一个对象是否是某个类的实例。当我们在使用类时,可以通过 instanceof 检查来确认一个实例是否符合该类的定义

class User {public nickname: string | undefinedpublic group: number | undefined
}class Log {public count: number = 10public keyword: string | undefined
}function typeGuard(arg: User | Log) {if (arg instanceof User) {arg.count = 15 // Error, User 类型无此属性}if (arg instanceof Log) {arg.count = 15 // OK}
}

为什么用instanceof呢?因为typeof有局限性,引用类型比如数组,正则等无法精确识别是哪一个种型,instanceof能够识别变量(比如实例对象)是否属于这个类。

但是注意,interface接口是不能用instanceof去检查。 接口的 instanceof 检查需要类型谓词。

interface Foo {...}
interface Bar {...}function test(input: Foo | Bar) {if (input instanceof Foo) {// 这里 input 的类型「收紧」为 Foo} else {// 这里 input 的类型「收紧」为 Bar}
}

上面是错误的写法,正确的方法可以看这篇推文

in关键字

interface one {name: string;speak: string;
}
​
interface two {age: number;see: string;
}
​

先写两个接口one、two(不懂接口的可以看我这篇文章),然后将这两个接口进行联合声明一种混合类型。

type customType = one | two;

使用in来判断属性是否在传递的参数中,然后分别作输出。类似于在JS中我们根据特定的属性判断这个对象是我们要找的哪个对象。

function test(value: one | two) {
// function test(value: type) {if("name" in value) {// 因为有name 这里收紧为value 对象为 oneconsole.log(value.speak);}if("see" in value) {// 因为有see 这里收紧为value 对象为 twoconsole.log(value.see);}
}

 缺点用 in 关键字缩小数据类型至少有一个独特的属性作为判别标准,否则不能用 in 关键字

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/70690.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

2023-08-31 LeetCode每日一题(一个图中连通三元组的最小度数)

2023-08-31每日一题 一、题目编号 1761. 一个图中连通三元组的最小度数二、题目链接 点击跳转到题目位置 三、题目描述 给你一个无向图,整数 n 表示图中节点的数目,edges 数组表示图中的边,其中 edges[i] [ui, vi] ,表示 ui…

一个简单的DNS服务器

DNS数据包的格式如下: 头部:会话标识ID,用于标识报文的ID标识,对于请求报文和其对应的应答报文,这个字段是相同的,通过它可以区分DNS应答报文是哪个请求的响应。正文: Queries区域 查询名QNAME…

Python入门学习14(面向对象)

一、内置方法 二、封装 1. 封装的概念是指? 将现实世界事物在类中描述为属性和方法,即为封装。 2. 什么是私有成员?为什么需要私有成员? 现实事物有部分属性和行为是不公开对使用者开放的。同样在类中描述属性和方法的时…

Maven 项目配置使用备忘录

创建 Maven 项目: mvn archetype:generate -DgroupIdcom.ivandu -DartifactIdcmaimms -DarchetypeArtifactImaven-archetype-quickstart -DinteractiveModefalse命令解释: -DgroupId 组织Id(项目包名)。-DartifactId ArtifactI…

如何分库分表?

分析&回答 分库?分表?还是既分库又分表? 如果需要分表,那么分多少张表合适? 由于所有的技术都是为业务服务的,那么,我们就先从数据方面回顾下业务背景。 如果每天产生 8w 笔交易单&#…

SCRUM敏捷产品负责人(CSPO)认证培训课程

课程简介 Scrum是目前运用最为广泛的敏捷开发方法,是一个轻量级的项目管理和产品研发管理框架。产品负责人是Scrum的三个角色之一,产品负责人在Scrum产品开发当中扮演舵手的角色,他决定产品的愿景、路线图以及投资回报,他需要回答…

系统日期如何在页面展示,框架是react或者vue3

安装插件dayjs或者moment.js 2.使用setInterval(useInterval)或者requestAnimationFrame react项目中useInterval的代码示例: import React, {useState } from react; import { useInterval } from "ahooks"; import moment fro…

学单片机有前途吗?

学单片机有前途吗? 个人认为学习任何一门技术都比不学的强,针对学单片机有前途吗?那么比较对象当然就是在整个IT行业做对比。因此我们可以从职业前景、钱景、这几方面综合考量。 学单片机有前途吗?我觉得重要的一点就是是否适合职业生涯发展,总说程序…

C++内存管理(2)new、delete详解

目录 new operator(new操作) new类对象时加不加括号的差别 new工作任务 delete工作任务 new和delete 堆区空间操作(对比malloc和free) new和delete操作基本类型的空间 new和delete操作基本类型的数组 new和delete操作类的…

elasticsearch访问9200端口 提示需要登陆

项目场景: 提示:这里简述项目相关背景: elasticsearch访问9200端口 提示需要登陆 问题描述 提示:这里描述项目中遇到的问题: 在E:\elasticsearch-8.9.1-windows-x86_64\elasticsearch-8.9.1\bin目录下输入命令 ela…

简单谈下Spring、Spring MVC和Spring Boot

Spring是一个开源的轻量级框架,用于构建Java应用程序。它提供了一种全面的编程和配置模型,可以帮助开发人员构建各种类型的应用程序,从简单的控制台应用程序到大型企业级应用程序。Spring框架的主要目标是提高应用程序的可维护性、可扩展性和…

Java真过饱和了吗?现在学Java迟了?

Java行业内幕揭秘 我是某有名机构的线下课Java老师,负责Java热门框架教学,如Spring、Spring MVC、Spring Boot。但最近被解雇了,让我来吐槽一下。Java现在的学习人数真的太多太多了。 Java的学习饱和度 Java学习的人太多,给你一…

python Playwright优化页面等待和处理异步操作

在使用 Playwright 进行页面自动化时,优化页面等待和处理异步操作是非常重要的,可以提高脚本的稳定性和执行效率。 优化页面等待和处理异步操作的建议 **1. 使用正确的等待条件:**Playwright 提供了多种等待条件,如等待元素出现…

Linux修改24小时制中国时区

1. 执行命令修改时区 tzselect 2. 时区依次选 亚洲 5) Asia 中国 9) China 北京 1) Beijing Time 确定 1) Yes 3. 执行命令使其生效 #TZAsia/Shanghai; export TZ ln -sf /usr/share/zoneinfo/Asia/Shanghai /etc/localtime #上海时区 ln -sf /usr/share/zoneinfo/Etc/GMT…

【CSS】简记CSS效果:通过transition(动画过渡属性)实现侧边栏目滑入滑出

需求 在资金明细的页面中&#xff0c;点击按钮时筛选区域从左侧滑出&#xff0c;完成筛选点击确认后调用接口完成数据查询&#xff0c;筛选区域滑入左侧&#xff1b; 基于微信小程序页面实现 wxml代码 <view><!-- 操作按钮 --><button type"primary&qu…

昨天面试的时候被提问到的问题集合(答案)

1、vue的双向绑定原理是什么&#xff1f;里面的关键点在哪里&#xff1f; Vue的双向绑定原理是基于Object.defineProperty或者Proxy来实现的&#xff0c;其关键点在于数据劫持&#xff0c;即对数据的读取和修改进行拦截&#xff0c;在数据发生变化时自动更新视图 2、实现水平垂…

力扣(LeetCode)算法_C++—— 快乐数

编写一个算法来判断一个数 n 是不是快乐数。 「快乐数」 定义为&#xff1a; 对于一个正整数&#xff0c;每一次将该数替换为它每个位置上的数字的平方和。 然后重复这个过程直到这个数变为 1&#xff0c;也可能是 无限循环 但始终变不到 1。 如果这个过程 结果为 1&#xff0…

JVM调优记录

因为大量数据备份&#xff1b;导致在备份过程出现堆溢出的情况 当前情况 总内存&#xff1a;7.92G 已使用&#xff1a;3.7G jvm总内存最大&#xff1a;3.06G jvm非堆内存&#xff1a;最大1.23G&#xff0c;使用<170M jvm堆内存&#xff1a;最大1.83G 计算 如果预留2G扩展…

PSP - 蛋白质结构预测 OpenFold Multimer 重构训练模型的数据加载

欢迎关注我的CSDN&#xff1a;https://spike.blog.csdn.net/ 本文地址&#xff1a;https://spike.blog.csdn.net/article/details/132602155 OpenFold Multimer 在训练过程的数据加载时&#xff0c;需要将 MSA 与 Template 信息转换成 Feature&#xff0c;再进行训练&#xff0…

1772_WPS关闭WPS热点和云服务等模块

全部学习汇总&#xff1a; GitHub - GreyZhang/windows_skills: some skills when using windows system. 说起来&#xff0c;WPS加入的WPS热点以及WPS云服务等可能还都是很不错的功能。不过&#xff0c;我不是很喜欢。我喜欢我能够更加自由地去随心所欲使用我用的软件&#x…