JS中的??和?.操作符_js ??和?.-CSDN博客

本文介绍了JavaScript中的空值合并操作符??，当左侧操作数为null或undefined时返回右侧值，以及可选链操作符(?.)，用于安全地访问嵌套对象属性，避免因无效引用引发错误。同时，两者结合可以设置默认值。

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

1.空值合并操作符（??）

空值合并操作符（??）是一个逻辑操作符，
当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数。
例：

const nullValue = null;
const emptyText = “”; // 空字符串，是一个假值，Boolean("") === false
const someNumber = 42;

const valA = nullValue ?? “valA 的默认值”;
const valB = emptyText ?? “valB 的默认值”;
const valC = someNumber ?? 0;

console.log(valA); // “valA 的默认值”
console.log(valB); // “”（空字符串虽然是假值，但不是 null 或者 undefined）
console.log(valC); // 42

2.可选链操作符( ?. )

可选链操作符( ?. )允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符，不同之处在于，在引用为空(null 或者 undefined) 的情况下不会引起错误，该表达式短路返回值

例：

obj = {
name:‘小伟’,
age:‘18’
}
let getGender = obj?.gender
console.log(getGebder) // undefined

在一个不含 gender成员的 obj 中查找属性，因此结果是 undefined，所以赋值也不会执行，由此我们在项目中可以给genGender 一个初始值配合使用?.操作符

此外空值合并操作符也可以在使用可选链时设置一个默认值，如下：

let customer = {
name: “Carl”,
details: { age: 82 }
};

let customerCity = customer?.city ?? “暗之城”;
console.log(customerCity); // “暗之城”