Javascript即将迎来Optional Chaining

Optional Chaining 现在处于 Stage 1。

它是什么?

Optional Chaining 使我们能检查一个对象上面是否存在某属性。其它一些语言有类似的特性。C# 例如,有 Null Conditional 操作符很像提案中的 Optional Chaining。

我们为何需要它?

你是否曾经在使用对象或数组的属性之前,检查它是否存在吗?如果你不记得,下面展示一下:

if(specimen && specimen.arms && specimen.arms.length > 2)
    console.log("This is probably an alien");

如果我们不做检查,可能会遇到下面的错误:

因为,specimen 存在,但它没有 arms 属性。因此,当我们在它身上获取length属性时就会报错。

提案是怎样的?

取代上面的写法,我们可以使用 optional chaining 写出如下代码:

if(specimen?.arms?.length > 2)
    console.log("This is probably an alien");

不管怎样,我们应该记住 Optional Chaining 操作符是 ?. 而不是 ? ,这就意味着当我们从数组中获取数据时,应该如下:

var firstArm = specimen?.arms?.[0]; //CORRECT
var secondArm = specimen?.arms?[1]; //WRONG

相似的,当我们检查一个方法时,如下:

var kickPromise = specimen?.kick?.();  //CORRECT
var punchPromise = specimen?.punch?(); //WRONG

在上例中,在调用方法之前,我们先检查 kick 是否存在。

它是如何工作的?

这个操作符检查 ?. 左边的值是否为 null 或 undefined。如果是,这个表达式就终止然后返回 undefined。否则,这个表达式继续执行就像没有错误一样。

原文发布于微信公众号 - 前端黑板报(FeHeiBanBao)

原文发表时间:2018-03-03

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏博客园

Core官方DI解析(4)--CallSiteRuntimeResolver

这两个类都在其CallSiteVisitor<TArgument, TResult>基类中

863
来自专栏LanceToBigData

struts2(六)之ognl表达式与ActionContext、ValueStack

前言   前面已经把struts2讲内容说了一半了,我写的很详细,希望对博友们有帮助。 一、OGNL表达式语言概述 1.1、OGNL表达式简介   百度上是这样...

2807
来自专栏爱撒谎的男孩

Struts2之OGNL的使用

3965
来自专栏PHP在线

CTF之PHP黑魔法总结

php黑魔法,是以前做CTF时遇到并记录的,很适合在做CTF代码审计的时候翻翻看看。 一、要求变量原值不同但md5或sha1相同的情况下 1.0e开头的全部相等...

5968
来自专栏Python爱好者

Python高效编程(一)

2259
来自专栏华仔的技术笔记

再议Block

2997
来自专栏绿巨人专栏

TypeScript中的怪语法

4715
来自专栏GreenLeaves

C# Encoding

之前做公司项目的时候,对于C#编码这块总是一知半解,所以打算通过这篇笔记对C#编码(Encoding)进行彻底的扫盲,关于编码和字符集的基础知识,请参考字符集和...

2687
来自专栏李蔚蓬的专栏

JavaScript_note1

4.6.字符串运算符 字符串运算符是用于两个字符型数据之间的运算符,除了比较运算符之外,还可以是+和+=运算符。 Demo:

1012
来自专栏编程心路

SSH框架之旅-struts2(3)

OGNL,全称是 Object-Graph Navigation Language(对象导航语言),是一种功能强大的开源表达式语言,通过简单的表达式语法就可以存...

1256

扫码关注云+社区

领取腾讯云代金券