你了解 ES6+ 中的可选链和空值合并运算符吗？

在ES6及更高版本中，可选链（Optional Chaining）和空值合并运算符（Nullish Coalescing Operator）都是为提高代码安全性和可读性而引入的新特性。

1. 可选链（?.）：
   可选链允许安全访问对象的深层属性，避免了因未定义（undefined）或空（null）值导致的类型错误（如Cannot read property ‘x’ of undefined）。它的语法使用 . 改为 ?.。
   例如：

   const user = { profile: null }; // profile 属性为 null
   const street = user?.profile?.address?.street; // 安全访问，返回 undefined 而不是报错
   console.log(street); // 输出: undefined
   
   // 比较传统方式需要冗长检查
   // let street = user && user.profile && user.profile.address && user.profile.address.street;
   

   优点：减少了代码量，提升了可维护性；适用场景包括API响应或嵌套数据结构中不确定性数据访问。

2. 空值合并运算符（??）：
   空值合并运算符用于指定默认值，仅在左侧表达式为空（null）或未定义（undefined）时返回右侧的值。它与逻辑或运算符 || 不同，因为它只过滤 null 或 undefined（而不处理 falsy 值如0或空串）。
   例如：

   const count = 0;
   const initialCount = count ?? 10; // 返回 0，因为 count 不是 null/undefined
   console.log(initialCount); // 输出: 0
   
   const username = null;
   const defaultUsername = username ?? 'Guest'; // 返回 'Guest'
   console.log(defaultUsername); // 输出: Guest
   
   // 使用 || 的对比示例
   const output = 0 || 10; // 返回 10，误以为 0 为 falsy
   

   优点：更精确的值处理，避免了 falsy 值意外覆盖问题。

这些特性结合使用可以大幅简化代码的防御性检查和默认值赋值：

const user = { profile: null };
const zipCode = user?.profile?.zipCode ?? 100000; // 安全访问并设置默认值
console.log(zipCode); // 输出: 100000

在实际开发中（如React或Vue组件中），它们减少了繁琐的条件语句，提升了性能和可测性。核心优势是增强了开发效率，让JavaScript在异步和实时数据处理场景更健壮。