时间戳

首页 > 解决方案 > 什么是 Javascript ？操作员？

javascript - 什么是 Javascript ？操作员？

问题描述

我正在为自己创建和回答这个问题，因为谷歌搜索“Javascript ?. Operator”没有提供有用的结果。

关于？的问题。要回答的操作员：

  1. 这个运算符叫什么？
  2. 运营商是如何工作的？
  3. 打字稿是否支持此运算符？

标签： javascriptoperators

解决方案

  1. 这是空传播运算符（AKA 存在运算符）。使用运算符称为可选或条件链接。
  2. 当必须访问中间属性可能为空/未定义的对象的深度嵌套的正确值时，此运算符很有用。

例如考虑这个人对象

let person = {
  name : {
     first : "John",
     last : "Doe"
  },
  age : 31
}

我将访问此人的姓氏

let lastName = person.name.last;

这一切都很棒，但是如果名称对象不存在怎么办？那么前面的代码行会抛出以下错误

未捕获的类型错误：无法读取未定义的属性“最后一个”

为了解决这个问题，必须检查 name 属性以确保它存在。这会将我们简单的一行代码变成以下代码

let lastName;
if(person.name){
 lastName = person.name.last;
}

或者

let lastName = person && person.name && person.name.last

第一个选项只是麻烦，第二个选项也不会膨胀。（我个人认为语法令人困惑）作为解释，第二个选项是检查 person 是否真实，如果是，它将检查 person.name 是否真实，如果是 person.name.last 将保存到 lastName 中。

所以这里是 Null Propagation Operator 的魔力我可以将以上所有片段重写为

let lastName = person?.name?.last

现在，如果 person 或 name 为 null/undefined，lastName 将设置为 null/undefined，并且不会引发错误。对于高度嵌套的对象，这可以节省大量的错误检查和代码行。

  1. 从技术上讲，这只是一个提议的 ES7 更改（https://github.com/tc39/proposal-optional-chaining），但如果您在任何 chromium 浏览器的控制台中尝试它，它就可以工作。

从 3.7 开始，Typescript 支持可选链接 https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-7.html#optional-chaining

推荐阅读