本文转载自公众号《核心阅读》（ID：AI_Discovery）。JavaScript以其众多的技巧而著称，要了解JavaScript的所有技巧几乎是不可能的。最近在浏览JavaScript相关文档和阅读相关话题时，发现了一个以前从未见过的特征点。我可能不是最后一个学习这个技巧的人，所以我想我会和大家分享。它完全改变了我访问嵌套对象的方式！希望对大家有帮助。这个技巧称为可选链接。它实际上是一个写为?..的运算符。根据Mozilla网站文档，可选链接运算符的功能是允许读取位于连接对象链深处的属性的值，而不必显式验证中的每个引用链是有效的。简而言之，可选的链接运算符极大地简化了对嵌套对象的访问。只需查看此示例，即可帮助您更好地理解可选链接运算符的作用。如果有一个对象“house（房子）”如下：consthouse={price:1000000,currency:USD,address:{city:NewYork,street:Mainstreet,postal_code:1234AB,state:{name:NewYork,abbreviation:N.Y.}},owner:{name:"JohnDoe"}}通常访问对象属性如下：constcurrency=house.currencyconstprice=house.priceconstowner=house.owner.name这是读取对象值的基础。房子没有主人怎么办？我们将无法读取不存在的命名属性，最后一行代码将引发错误。为了弥补这一点，你可以这样做：constowner=house.owner?house.owner.name:null高手可以使用空值合并运算符：constowner=house.owner.name??null这串代码的问题就是，即使房子对象没有主人，它也不会停止运行。看看下面的例子：consthouse={price:1000000,currency:USD,address:{city:NewYork,street:Mainstreet,postal_code:1234AB,state:{name:NewYork,abbreviation:N.Y.}},owner:null}使用null合并运算符将导致错误，因为它无法读取属性中为null的名称。第一个示例可以使用三元运算符运行。但是如果要探索的属性是多层嵌套的，需要逐一检查是否存在，那么代码会非常冗长，难以阅读。例如，要检查状态：conststate=house.address&&house.address.state?house.address.state.name:null如您所见，这行代码变得非常长且不可读。这是可选的链接运算符派上用场的地方。有了它，就无需检查某个属性是否存在，从而使代码简洁易懂。如果属性不存在，则返回“undefined”。运算符实际上是这样的：constcity=house?.address?.city//"NewYork"constnonExisting=house?.roof?.material//UndefinedconsthousehouseNumber=house?.address?.number//Undefinedconststate=house?。地址?.state?.abbreviation//“N.Y.”是不是一下子变得很简洁明了！来源：unsplash例1尝试探索“address”属性下的“city”属性的值。由于存在该属性，因此将返回“city”属性，与使用house.address.city获取值相同。示例2尝试获取有关屋顶建筑材料的信息。但是“house”对象下没有“roof”属性，所以返回“undefined”，“houseNumber”属性也是如此。虽然“house”对象有一个“address”属性，但这个属性不包含“number”属性——这就是为什么这里返回“undefined”的原因。您还可以使用可选的链接运算符来动态查询属性，这需要括号：constsomeProperty=obj?.[property-+propertyName]也可以与null合并运算符一起使用。如果你想为一个变量设置一个默认值，例如：constownerName=house?.owner?.name??“Unknowner”函数目前只是将可选的链接运算符与对象组合在一起。但它也可以与功能结合。可以用来调用不存在的方法，像这样：constresult=someObject.customMethod?.();旧浏览器支持适配（如IE浏览器）不支持optionalchainoperator，其他现代JavaScript特性做同样的事情。Google、Firefox、Opera和Safari等新的浏览器都支持可选链，但这并不妨碍使用可选链，需要时可以在浏览器中添加polyfill。使用可选的链接运算符访问链深处的对象，而不检查嵌套对象中的每个引用是否有效。它最大的优点是运行起来简洁漂亮，不仅针对对象，对于可能不存在的方法的调用也是如此。但请记住，它在IE中不起作用——就像任何其他现代JavaScript功能一样。这些较旧的浏览器需要polyfill来运行可选链接。JavaScript总是在学习，总是新的，而且里面总是有新的鸡蛋！
