JavaScript 的可选链（Optional Chaining）|可选链运算符?.

JavaScript 的可选链（Optional Chaining）是 ES2020 引入的一种语法特性，用于简化深层嵌套对象属性的访问。使用可选链可以避免在访问对象的嵌套属性时遇到 undefined 或 null 导致的错误。

具体来说，可选链运算符（?.）允许你在访问对象的属性或调用对象的方法时，如果对象的某个部分是 null 或 undefined，运算会短路并返回 undefined 而不会继续访问后续属性以及抛出错误。

基本语法

可选链运算符的基本语法如下：

obj?.prop
obj?.[expr]
arr?.[index]
func?.(args)

使用示例

1. 访问对象的嵌套属性：

   let user = {
       profile: {
           name: "Alice",
           address: {
               city: "Wonderland"
           }
       }
   };
   
   // 使用可选链访问嵌套属性
   let city = user?.profile?.address?.city;
   console.log(city); // 输出 "Wonderland"
   
   // 如果某个属性不存在，不会抛出错误
   let country = user?.profile?.address?.country;
   console.log(country); // 输出 undefined
   

2. 访问数组元素：

   let arr = [1, 2, 3];
   
   // 使用可选链访问数组元素
   let firstElement = arr?.[0];
   console.log(firstElement); // 输出 1
   
   // 访问超出范围的索引，不会抛出错误
   let outOfRangeElement = arr?.[10];
   console.log(outOfRangeElement); // 输出 undefined
   

3. 调用对象的方法：

   let user = {
       greet: function() {
           return "Hello!";
       }
   };
   
   // 使用可选链调用方法
   let greeting = user?.greet?.();
   console.log(greeting); // 输出 "Hello!"
   
   // 调用不存在的方法，不会抛出错误
   let farewell = user?.farewell?.();
   console.log(farewell); // 输出 undefined
   

优势

• 安全性：避免了因访问 null 或 undefined 属性而导致的错误。
• 简洁性：减少了大量的存在性检查代码，使代码更加简洁和易读。

结论

可选链运算符是一个非常有用的工具，特别是在处理复杂数据结构时。它使得代码更具鲁棒性和可读性，避免了繁琐的 null 或
undefined 检查。