TypeScript特有运算符和操作符
文章目录
- TypeScript 特有运算符
- 1. `keyof`
- 2. `typeof`
- 3. `in`
- 4. `extends`
- 5. `is`
- 6. `as` 和 `<Type>`
- 7. `never`
- 8. `readonly`
- 9. `?`
- 10. `[]`
- 11. `|` 和 `&`
- 12. `!`
- 13. `??` 和 `?.`
- 总结
TypeScript 特有运算符
1. keyof
- 作用:用于获取对象类型的所有键(属性名)组成的联合类型。
- 语法:
keyof Type
interface Person {name: string;age: number;
}type PersonKeys = keyof Person; // "name" | "age"
2. typeof
- 作用:用于获取变量或值的类型。
- 语法:
typeof variable
let j: string = "hello";
type JType = typeof j; // string
3. in
- 作用:用于检查对象是否包含某个属性。
- 语法:
key in object
interface User {name: string;age: number;
}let m: keyof User = "name";
let n: User = { name: "风茫", age: 18 };
console.log(m in n); // true
4. extends
- 作用:用于泛型约束,表示一个类型是否是另一个类型的子类型。
- 语法:
T extends U
function add<T extends number>(a: T, b: T): T {return a + b;
}add(1, 2); // 合法
// add("1", "2"); // 报错
5. is
- 作用:用于类型保护,定义一个返回布尔值的函数,用于类型判断。
- 语法:
parameter is Type
function isString(value: any): value is string {return typeof value === "string";
}let o: any = "hello";
if (isString(o)) {console.log(o.toUpperCase()); // 合法
}
6. as
和 <Type>
- 作用:用于类型断言,告诉编译器某个值的具体类型。
- 语法:
value as Type
或<Type>value
let p: any = "123";
let q = p as number; // 类型断言
// 或者
let r = <number>p; // 类型断言
7. never
- 作用:表示永远不会发生的值的类型,通常用于函数的返回类型。
- 语法:
never
function error(message: string): never {throw new Error(message);
}
8. readonly
- 作用:用于定义只读属性。
- 语法:
readonly property: Type
interface Person {readonly id: number;name: string;
}const person: Person = {id: 1,name: "风茫"
};// person.id = 2; // 报错
9. ?
- 作用:用于定义可选属性。
- 语法:
property?: Type
interface SquareConfig {color?: string;width?: number;
}
10. []
- 作用:用于定义数组类型。
- 语法:
Type[]
或Array<Type>
let s: number[] = [1, 2, 3];
let t: Array<number> = [1, 2, 3];
11. |
和 &
- 联合类型 (
|
):表示一个值可以是多种类型之一。 - 交叉类型 (
&
):表示一个值必须同时满足多种类型。
let u: string | number = "hello";
u = 123;interface A {a: string;
}interface B {b: number;
}let v: A & B = {a: "hello",b: 123
};
12. !
- 非空断言操作符:告诉编译器某个值不会是
null
或undefined
。 - 语法:
value!
function printLength(str: string | null) {console.log(str!.length); // 非空断言
}
13. ??
和 ?.
- 空值合并操作符 (
??
):如果左侧操作数为null
或undefined
,则返回右侧操作数。 - 可选链操作符 (
?.
):如果对象属性存在,则返回该属性值,否则返回undefined
。
let w: string | null = null;
let x = w ?? "default"; // "default"interface User {name?: string;
}let y: User = {};
console.log(y?.name); // undefined
总结
TypeScript 中的这些特有运算符主要用于类型定义和类型检查,帮助开发者编写更安全、更可靠的代码。通过合理使用这些运算符,可以提高代码的可读性和可维护性。
keyof
:获取对象的所有键。typeof
:获取变量的类型。in
:检查对象是否包含某个属性。extends
:泛型约束。is
:类型保护。as
和<Type>
:类型断言。never
:表示永远不会发生的值。readonly
:定义只读属性。?
:定义可选属性。[]
和Array<Type>
**:定义数组类型。|
和&
:联合类型和交叉类型。!
:非空断言。??
和?.
:空值合并和可选链操作符。
这些运算符使得 TypeScript 成为一种强大的静态类型语言,能够更好地帮助开发者进行类型安全的编程。
相关文章:
![](https://www.ngui.cc/images/no-images.jpg)
TypeScript特有运算符和操作符
文章目录 TypeScript 特有运算符1. keyof2. typeof3. in4. extends5. is6. as 和 <Type>7. never8. readonly9. ?10. []11. | 和 &12. !13. ?? 和 ?. 总结 TypeScript 特有运算符 1. keyof 作用:用于获取对象类型的所有键(属性名&#x…...
![](https://www.ngui.cc/images/no-images.jpg)
介绍下常用的前端框架及时优缺点
以下是一些常用的前端框架及其优缺点介绍: React • 优点 • 组件化架构:可构建可复用的UI组件,提高开发效率和组件可维护性。 • 虚拟DOM:高效更新页面,减少直接操作DOM的性能开销。 • 灵活性和可扩展性…...
![](https://www.ngui.cc/images/no-images.jpg)
MATLAB算法实战应用案例精讲-【数模应用】图形变换和复杂图形组合(附python和MATLAB代码实现)
目录 前言 算法原理 变换 1二维变换 1.1缩放 1.2 翻转 1.3剪切 1.4 旋转 2齐次坐标 2.1引入齐次坐标的原因 2.2 二维齐次坐标 2.3二维仿射变换 2.4逆变换 4组合变换 5三维变换(由二维变换推理而来) 5.1三维齐次坐标 5.2 三维仿射变换 5.3 缩放和平移 5.4…...
![](https://i-blog.csdnimg.cn/direct/14d5a7d64c554f6a8401966ae78a37f2.png)
SpringMVC 实战指南:打造高效 Web 应用的秘籍
第一章:三层架构和MVC 三层架构: 开发服务器端,一般基于两种形式,一种 C/S 架构程序,一种 B/S 架构程序使用 Java 语言基本上都是开发 B/S 架构的程序,B/S 架构又分成了三层架构三层架构: 表现…...
![](https://www.ngui.cc/images/no-images.jpg)
doris: Flink导入数据
使用 Flink Doris Connector 可以实时的将 Flink 产生的数据(如:Flink 读取 Kafka,MySQL 中的数据)导入到 Doris 中。 使用限制 需要依赖用户部署的 Flink 集群。 使用 Flink 导入数据 使用 Flink 导入数据,详…...
![](https://i-blog.csdnimg.cn/img_convert/394c9cc27da0540afac2baff28937d95.png)
Nginx在Linux中的最小化安装方式
1. 安装依赖 需要安装的东西: wget,方便我们下载Nginx的包。如果是在Windows下载,然后使用SFTP上传到服务器中,那么可以不安装这个软件包。gcc g,Nginx是使用C/C开发的服务器,等一下安装会用到其中的…...
![](https://www.ngui.cc/images/no-images.jpg)
CSS布局新视角:BFC(块级格式化上下文)的作用与优势
在CSS布局的世界中,BFC(Block Formatting Context,块级格式化上下文)是一个既重要又神秘的概念。它不仅是解决复杂布局问题的关键工具,也是提升页面性能和用户体验的重要手段。本文将从新视角出发,深入探讨…...
![](https://img-blog.csdnimg.cn/b92d40571f164afd89ce38f4d556068e.png#pic_center)
PCL K4PCS算法实现点云粗配准【2025最新版】
目录 一、算法原理1、算法概述2、算法流程3、参考文献二、 代码实现1、原始版本2、2024新版三、 结果展示本文由CSDN点云侠原创,原文链接,首发于:2020年4月27日。如果你不是在点云侠的博客中看到该文章,那么此处便是不要脸的抄袭狗。 博客长期更新,本文最近一次更新时间为…...
![](https://i-blog.csdnimg.cn/img_convert/35a26b815b341ed269097e3674792dfb.png)
02IO篇(D2_深入IO模型)
目录 本章目标 一、用户空间和内核空间 二、PIO与DMA 三、缓存IO和直接IO 1. 缓存IO 2. 直接IO 三、IO访问方式 1. 磁盘IO 2. 网络IO 3. 磁盘IO和网络IO对比 四、Socket网络编程 1. 客户端 2. 服务端 示例一 示例二 示例三 五、同步IO和异步IO 六、阻塞IO和非…...
![](https://i-blog.csdnimg.cn/direct/76b13370e0b54756976d34bf337eacb6.png)
记录一次微信小程序使用云能力开发的过程
对于开发微信小程序云开发不知从何起的同学们,可以当作一次参考。虽说官方有文档,有模板示例,但是这些都是片段或者完整的结果展示。对于初学或者开发经验较少的同学们,可能不知先从那里入手进行第一步的开发。下面解析下构建微信…...
![](https://www.ngui.cc/images/no-images.jpg)
Learning Prompt
说明:这是我的学习笔记,很多内容转自网络,请查阅文章末尾的参考资料。 目录 基本要求(C.R.E.A.T.E)总结文章(Summarise)改写文章(Rewrite)根据参考资料回答问题(Question & Answer)参考资料 基本要求(C.R.E.A.T.E) Character This is th…...
![](https://www.ngui.cc/images/no-images.jpg)
事务处理系统 (Transaction Processing System, TPS)
事务处理系统 (Transaction Processing System, TPS) 是一种专门用于自动化日常业务事务处理的计算机系统。这类系统通常处理大量的结构化数据,如订单处理、支付结算、库存管理等,以支持企业日常的运营和管理。TPS 的核心任务是确保高效、准确地记录和管理大量重复性的事务,…...
![](https://www.ngui.cc/images/no-images.jpg)
【PCIe 总线及设备入门学习专栏 5.3.2 -- PCIe 枚举与 PCIe PHY firmware 的区别与联系】
文章目录 OverviewPCIe 枚举与PCIe PHY固件的区别与联系1. PCIe 枚举2. PCIe PHY固件3. 区别4. 联系 举例说明实例场景 1:服务器启动 PCIe 网卡的过程实例场景 2:PCIe 热插拔设备的调试 Overview 本文将详细介绍 PCIe 枚举与 PCIe PHY firmware 的区别与…...
![](https://i-blog.csdnimg.cn/direct/c861fb30acee4a95b32afc319d801747.jpeg)
职场的三个阶段及其应对规划:以前端开发工程师为例
作为职场人士,特别是 IT 开发工程师,职业生涯的发展路径往往伴随着不同的挑战与机遇。一般而言,职场生涯可以划分为三个阶段:找工作阶段、有工作阶段以及职业转型阶段。每个阶段都有其特定的特征和应对策略,下面我将从…...
![](https://i-blog.csdnimg.cn/img_convert/0d14026241e86c8f51bd2cf2c82f4674.png)
某讯一面,感觉问Redis的难度不是很大
前不久,有位朋友去某讯面试,他说被问到了很多关于 Redis 的问题,比如为什么用 Redis 作为 MySQL 的缓存?Redis 中大量 key 集中过期怎么办?如何保证缓存和数据库数据的一致性?我将它们整理出来,…...
![](https://i-blog.csdnimg.cn/direct/0a30822bc5744962b87c13c292cef3a4.png)
RV1126+FFMPEG推流项目(9)AI和AENC模块绑定,并且开启线程采集
前面两篇已经交代AI和AENC模块的配置,这篇就让这两个模块绑定起来,绑定的原因是,Aenc从Ai模块拿到采集的原始数据进行编码。 使用 RK_MPI_SYS_Bind 把 AI 节点和 AENC 进行绑定,其中 enModId 是模块 ID 号选择的是 RK_ID_AI、s32C…...
![](https://i-blog.csdnimg.cn/direct/f98e9370a12548198e6029a08a5d6281.png)
excel实用工具
2. 命令 2.1 查找 vloopup...
![](https://i-blog.csdnimg.cn/direct/5ad70aaed64f4d4a965d587059c194fe.png)
基于.Net Core+Vue的文件加密系统
1系统架构图 2 用例图 管理员角色的用例: 文件分享大厅:管理员可以访问文件分享大厅,下载文件。个人信息管理:管理员可以更新自己的个人信息,修改密码。用户管理:管理员负责创建、更新或删除用户账户&…...
![](https://i-blog.csdnimg.cn/direct/226bd069fead49cc93b8b09832bc7d67.png)
工业网口相机:如何通过调整网口参数设置,优化图像传输和网络性能,达到最大帧率
项目场景 工业相机是常用与工业视觉领域的常用专业视觉核心部件,拥有多种属性,是机器视觉系统中的核心部件,具有不可替代的重要功能。 工业相机已经被广泛应用于工业生产线在线检测、智能交通,机器视觉,科研,军事科学,航天航空等众多领域 …...
![](https://www.ngui.cc/images/no-images.jpg)
深入理解 Windows Server 的核心功能:现代 IT 架构的基石
深入理解 Windows Server 的核心功能:现代 IT 架构的基石 在现代 IT 基础架构中,Windows Server 一直扮演着不可或缺的角色。它不仅是一个强大的服务器操作系统,更是企业级解决方案的核心支柱。从中小型企业到跨国公司,Windows Server 提供了从身份管理到高可用性的一系列…...
![](https://i-blog.csdnimg.cn/img_convert/384cc632636078e74897cb36d895d6fa.png)
WEB渗透技术研究与安全防御
目录 作品简介I IntroductionII 1 网络面临的主要威胁1 1.1 技术安全1 2 分析Web渗透技术2 2.1 Web渗透技术的概念2 2.2 Web漏洞产生的原因2 2.3 注入测试3 2.3.1 注入测试的攻击流程3 2.3.2 进行一次完整的Sql注入测试4 2.3.3 Cookie注入攻击11 3 安全防御方案设计…...
![](https://i-blog.csdnimg.cn/direct/951c199bbe834af2b3bbb647f21b3d49.png)
智能学习平台系统设计与实现(代码+数据库+LW)
摘 要 传统办法管理信息首先需要花费的时间比较多,其次数据出错率比较高,而且对错误的数据进行更改也比较困难,最后,检索数据费事费力。因此,在计算机上安装智能学习平台系统软件来发挥其高效地信息处理的作用&#…...
![](https://www.ngui.cc/images/no-images.jpg)
Java学习,List移动元素
Java实现List中元素的循环移动(即将列表中的元素向右或向左移动指定数量的位置),可以使用多种方法。 List元素移动指定位置: import java.util.ArrayList; import java.util.Collections; import java.util.List; public class…...
![](https://i-blog.csdnimg.cn/direct/701b6ef7c9984cfba0a3ffd13f0cc5d9.png)
Linux-----线程同步(资源竞争和同步锁)
目录 资源竞争(背景) 锁(解决方式,实现同步) 互斥锁 读写锁 自旋锁 资源竞争(背景) 竞态条件 当多个线程并发访问和修改同一个共享资源(如全局变量)时,…...
![](https://i-blog.csdnimg.cn/direct/cda59a52960e4bbf879204dcc25bf043.png)
当当网书籍信息爬虫
1.基本理论 1.1概念体系 网络爬虫又称网络蜘蛛、网络蚂蚁、网络机器人等,可以按照我们设置的规则自动化爬取网络上的信息,这些规则被称为爬虫算法。是一种自动化程序,用于从互联网上抓取数据。爬虫通过模拟浏览器的行为,访问网页…...
![](https://i-blog.csdnimg.cn/direct/791186d3fd8e46bb984cb67889703306.png)
React实现拖拽特效
前言 最近,我看到一个工程师的个人网站上,采用了拖拽作品集的互动特效,既有趣又吸引眼球。经过一些研究,我发现其实借助一些现成的套件,就能轻松实现这样的效果。今天就带大家一起看看,如何通过 Framer Mo…...
![](https://i-blog.csdnimg.cn/img_convert/82740f2f81992c0760484fa85a4dc74a.jpeg)
【竞技宝】LOL:ning直播再次锐评
北京时间1月18日,目前英雄联盟LPL2025正在如火如荼的进行之中,很多队伍都已经打完了新赛季的首场比赛,其中就包括AL战队,AL在休赛期进行了大幅度的人员调整,整体实力相比之前增强了不少,在16日的比赛中,AL3-0轻松击败LGD拿下了赛季开门红,而AL的打野选手tarzan在本场比赛中表现…...
![](https://www.ngui.cc/images/no-images.jpg)
ThreeJS能力演示——界面点选交互能力
1、支持界面点选 点选模型整体思路是:根据camera位置作为起始点,叠加鼠标相对位置作为偏置,摄像头方向作为射线方向。 根据射线方向中的遇到的3D物体列表,第一个遇到的物体作为被点选的物体。 // 鼠标事件处理let selectedObjec…...
![](https://i-blog.csdnimg.cn/direct/92725109b7a4443596363a39fc99d5ab.png)
flutter的web页面
有几个服务器 有几个后台 直接通过web端进去虽然说很方便,但… 于是把web页面镶嵌到应用里面去, 这样就换了个方式打开web页面了 比如这里有有个列表 这里是写死了,活的列表可以通过io去获取 import package:flutter/material.dart; imp…...
![](https://i-blog.csdnimg.cn/direct/7bd49e07921544328634141ced1bec13.png)
2025.1.17——三、SQLi regexp正则表达式|
题目来源:buuctf [NCTF2019]SQLi1 目录 一、打开靶机,整理信息 二、解题思路 step 1:正常注入 step 2:弄清关键字黑名单 1.目录扫描 2.bp爆破 step 3:根据过滤名单构造payload step 4:regexp正则注…...
![](/images/no-images.jpg)
如何在网站上做支付功能/网站提交
在想cocos适配之前,我们想想网页是怎么适配的。浏览器有各种规格,网页的一般做法是:背景图片铺满,网页内容保持在背景图片上居中,就实现了适应或者适配。css一般这样: .bg{ height:582px; background-image…...
![](/images/no-images.jpg)
外贸网站模板免费下载/徐汇网站建设
解 决 无 法 修 改 my .ini 文 件 的 问 题 my. i ni —— 》 右 键 “ 属 性 ” —— 》 “ 安 全 ” —— 》 点 击 “ 编 辑 ” —— 》 选 择 你 现 在 登录的账号 —— 》 修 改 你 的 操 作 权 限 ,其 中 包 括 :完 全 控 制 ,修 改 &a…...
![](/images/no-images.jpg)
湛江正规网站制作方案/seo解释
Tomcat的热部署(以后就不用重起了) 1、 tomcat上的部署问题,有时候也是个麻烦的问题,要是不采用热部署,我们就只能每次对原来的文件做一次改动的时候就要重新部署,而每次重新部署都要关闭tomcat࿰…...
![](/images/no-images.jpg)
青岛网站设计哪家好/做推广
具体伪代码如下:/*** 我把这一步封装成一个函数,以后再调用那些需要登录后才有权限访问的后台服务时.* 可以使用使用这个函数操作,基本逻辑,还可以进行扩展* url : 开发者服务器登录服务接口 可设置默认值* key : 存入本地缓存的第…...
武汉做网站找哪家好/营业推广
前端时间用 animation 实现 H5 页面中首页动画过渡,很简单的一个效果,首页加载一个客服头像,先放大,停留 700ms 后再缩小至顶部。代码如下 <!DOCTYPE html> <html> <head lang"zh-cn"><meta char…...
![](http://hi.csdn.net/attachment/201009/2/0_1283417278t7T2.gif)
广州企业网站建设靠谱/腾讯朋友圈广告怎么投放
Windows图形基础 Windows系统的两大部分: User32:提供windows应用程序的组成元素,比如窗口,文本框,按钮等。GDI/GDI:提供绘图API,比如绘制图形、文本与图像等。WCF不再基于User32和GDI/GDI,而是…...