ts(TypeScript)中?.和??分析及运用

最新推荐文章于 2025-05-28 10:47:40 发布

原创最新推荐文章于 2025-05-28 10:47:40 发布 · 1k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#typescript #javascript #html

Vue3 + TypeScript 专栏收录该内容

23 篇文章

订阅专栏

本文介绍了JavaScript中安全赋值操作符?.与??的使用方法。?.操作符用于避免访问null或undefined对象属性时出现错误，而??操作符提供了一种简便方式来设置默认值。这两种操作符可以有效提升代码的健壮性和可读性。

今天在写个人项目功能开发中，在给对象属性赋值过程中总是报一些莫名其妙的错误，经过调试发现在赋值的过程中有些属性为null或者undefined的时候会报错。具体用法如下：
在这里插入图片描述

?.用法

当?前的属性或者值为真时返回当前属性的值，否则返回null或者undefined

//a?.b ---> a && a.b ? a.b : undefined
this.toDoListEditData.name = this.person?.name;//相当于this.person&&this.person.name?this.person.name:null;
当对象和对象赋值的属性为true的时候（对象属性不等于0或者null或undefined时），获取this.person.name的值，否则为null或undefined;

??用法

当??前的属性为true时，返回当前属性的值，或者返回自定的值

this.toDoListEditData.name = this.person.name??''; //相当于this.person.name?this.person.name:'';
当对象属性this.person.name为true时，获取this.person.name的值，或者为''或者自定义的值