当前位置: 首页 > article >正文

一篇文章让你搞懂TypeScript中的??和?:和?.和!.是什么意思

TypeScript中的??和?:和?.和!.是什么意思?

  • 知识回调(不懂就看这儿!)
  • 场景复现
  • 核心干货
    • ??
    • ?:
    • ?.
    • !.

知识回调(不懂就看这儿!)

知识专栏专栏链接
TypeScript知识专栏https://blog.csdn.net/xsl_hr/category_12030346.html?spm=1001.2014.3001.5482

在这里插入图片描述

有关TypeScript的相关知识可以前往TypeScript知识专栏查看复习!!

场景复现

最近在前端的深入学习过程中,接触了与网络请求相关的内容,于是计划用三个专栏(HTTPAxiosAjax)和零碎文章总结记录最近的学习笔记。由于项目前端技术栈的脚本语言为TypeScript,在研读小程序异步请求封装部分的代码时,碰到了几个关于TypeScript的小知识点不太清楚。

问题代码截图:
在这里插入图片描述

因此,本文TypeScript中的???:?.!.为主要内容展开讲解。

核心干货

??

  • ?: 是指可选参数
  • 可以理解为参数自动加上undefined
function echo(x: number, y?: number) {
    return x + (y || 0);
}
getval(1); // 1
getval(1, null); // error, 'null' is not assignable to 'number | undefined'
interface IProListForm {
  enterpriseId: string | number;
  pageNum: number;
  pageSize: number;
  keyword?: string; // 可选属性
}

?:

  • ??|| 的意思有点相似,但是又有点区别
  • ??相较||比较严谨, 当值等于0的时候||就把他给排除了,但是??不会
console.log(null || 5)   //5
console.log(null ?? 5)     //5

console.log(undefined || 5)      //5
console.log(undefined ?? 5)      //5

console.log(0 || 5)       //5
console.log(0 ?? 5)      //0

?.

  • ?.的意思基本和 && 是一样的
  • a?.b 相当于 a && a.b ? a.b : undefined
const a = {
      b: { c: 7 }
};
console.log(a?.b?.c);     //7
console.log(a && a.b && a.b.c);    //7

!.

!.的意思是断言,告诉ts你这个对象里一定有某个值

const inputRef = useRef<HTMLEInputlement>(null);
// 定义了输入框,初始化是null,但是你在调用他的时候相取输入框的value,这时候dom实例一定是有值的,所以用断言
const value: string = inputRef.current!.value;
// 这样就不会报错了

以上就是关于 TypeScript中的???:?.!.是什么意思? 的知识分享,相信看完这篇文章的小伙伴们一定有了一定的收获。当然,可能有不足的地方,欢迎大家在评论区留言指正!

下期文章将介绍TypeScript中的typeof与keyof的相关内容
感兴趣的小伙伴可以订阅本专栏,方便后续了解学习~
觉得这篇文章有用的小伙伴们可以点赞➕收藏➕关注哦~

在这里插入图片描述


http://www.kler.cn/a/10150.html

相关文章:

  • 每日一练:二分查找-搜索插入位置
  • 【C#设计模式(8)——过滤器模式(Adapter Pattern)】
  • Blender进阶:图像纹理节点和映射节点
  • 【测试框架篇】单元测试框架pytest(1):环境安装和配置
  • docker运行ActiveMQ-Artemis
  • Java复习42(PTA)
  • 风电的Weibull分布及光电的Beta分布组合研究(Matlab代码实现)
  • 开源后台管理系统解决方案 boot-admin 简介
  • 关于ChatGPT人工智能浅谈
  • Oracle之PL/SQL游标练习题(三)
  • 服务器部署需要注意的事项
  • 多个渠道成功销售的秘诀速递
  • 深度学习数据集—水果数据集大合集
  • C++模板初阶
  • 系统集成项目管理工程师软考第三章习题(每天更新)
  • 如何找回u盘被删除的文件
  • 00后卷王的自述,我难道真的很卷?
  • 模拟点击是啥?如何实现的呢?
  • 分享4个不可或缺的 VSCode 插件,让 Tailwind CSS开发更简单
  • Spring核心与设计思想
  • 如何使用golang库gqlgen?如何在golang中实现graphql请求?
  • 环形缓冲区
  • 14 个快速简洁的单行 JavaScript 代码解决方案
  • 报名截至在即 | “泰迪杯”挑战赛最后一场赛前指导直播!
  • java 泛型 万字详解(通俗易懂)
  • 【Linux系统文件管理(cat,awk指令)和网络IP配置,广播地址,修改子网掩码以及ping网关地址】