？. 属性访问表达式：获取对象属性和数组元素的值

JS定义了两种访问属性的语法：

expression.identifier
expression[expression]

• 第一种：表达式后跟一个句点和一个标识符；
  • 其中表达式指定对象，标识符指定属性名；
• 第二种：表达式后跟另一个位于方括号中的表达式；
  • 第二个表达式指定属性名或数组元素的索引；
• 下面是几个具体的例子；

let o = {x:1, y:{z:3} };  //示例对象
let a = [o, 4, [5,6] ];   //包含前面对象的示例数组
o.x                       // 1 ,表达式o的属性x
o.y.z                     // 3 ,表达式o.y的属性z
0["x"]                    // 1 ,对象o属性x
a[1]                      // 4 ,表达式a中索引为1的元素
a[2]["1"]                 // 6 ,表达式a[2]中索引为1的元素
a[0].x                    // 1 ,表达式a[0]的属性x

• 无论哪种属性访问表达式，位于.或[]前面的表达式都会先求值，如果求值结果为null或undefined，则表达式会抛出TypeError;

条件式属性访问 ?.

• ES2020增加了两个新的属性访问表达式：

expression.identifier
expression[expression]

• 在Js中，null和undefined是唯一两个没有属性的值；
  • 在使用普通属性访问表达式时，如果.或[]左侧的表达式求值为null或undefined，会报TypeError;
  • 可以使用?.或?.[] 语法防止错误发生。
• 比如表达式a?.b,如果a是null或undefined，那么整个表达式的求值结果为UN的fined,不会尝试访问属性b;
  • 如果a是其他值，则a?.b求值为a.b的值，如果a没有名为b的属性，则整个表达式还是undefined;

  let a = { b:null}
  a.b?.c.d  //=>undefined