ts中可选链符号 ?:、 ?. 都是什么意思

最新推荐文章于 2025-05-19 09:39:40 发布

Bynine9

最新推荐文章于 2025-05-19 09:39:40 发布

阅读量1.2w

点赞数 15

CC 4.0 BY-SA版权

分类专栏：前端文章标签： javascript 前端 typescript

本文链接：https://blog.csdn.net/Bynine9/article/details/124749941

前端专栏收录该内容

21 篇文章

订阅专栏

这篇博客介绍了 TypeScript 中的可选参数、空值合并操作符(??)和断言(!)的概念及其使用场景。通过示例展示了它们在处理可能为 null 或 undefined 的值时的区别。对于可选参数，如 `name?` 和 `sex?`，它们允许函数参数不传。空值合并操作符比逻辑或运算符更严谨，不会将 0 视为空值。断言 (!) 则用于告诉编译器变量在特定情况下肯定有值，避免类型检查错误。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

?:是指可选参数，可以理解为参数自动加上undefined

export interface RequestForm{
    pageSize : number
    pageNumber : number
    name?:string // 可选属性
    sex ?:string // 可选属性
}

?? 和 || 的意思有点相似，但是又有点区别,??相较||比较严谨, 当值等于0的时候||就把他给排除了，但是?? 不会.

console.log(null || 1)   //1
console.log(null ?? 1)     //1

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

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

?.的意思基本和 && 是一样的

a?.b 相当于 a && a.b ? a.b : undefined

const a = { b:2}
console.log(a?.b);

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

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