第一步 安装
npm install --save-dev @babel/plugin-proposal-optional-chaining 然后在.babelrc.js文件夹里进行配置
plugins:"@babel/plugin-proposal-optional-chaining",
vscode好像不太支持这种语法,所以得在vscode的setting中配置
"javascript.validate.enable": false,

接下来就可以使用了

大概用法

     可以省略逻辑运算符
const obj={
a:{
b:1
},
       b:[1,2,4]
}
const num=obj && obj.a && obj.a.b
const num=obj?.a?.b
    const arr=obj?.b?.[0] //判断数组的第0项是否存在
在react项目中接受组件穿过来的方法时可以这么写
const {getValue}=this.props
getValue && getValue()
getValue?.()
数组在进行遍历前可以进行判断,避免数组为undefined报错
const arr=[1,2,3]
arr?.map(item=>{
//...
})

可选链plugin-proposal-optional-chaining的使用(优化)的更多相关文章

  1. 【Swift学习】Swift编程之旅---可选链(二十一)

    可选链Optional Chaining是一种可以在当前值可能为nil的可选值上请求和调用属性.方法及下标的方法.如果可选值有值,那么调用就会成功:如果可选值是nil,那么调用将返回nil.多个调用可 ...

  2. swift学习笔记之-可选链式调用

    //可选链式调用 import UIKit /*可选链式调用(Optional Chaining) 1.在可选值上请求和调用该可选值的属性.方法及下标的方法,如果可选值有值,那么调用就会成功,返回可选 ...

  3. Swift中可选型的Optional Chaining 和 Nil-Coalesce(Swift2.1)

    /* 下面是介绍Optional Chaining 和 Nil-Coalesce */ // Optional Chaining (可选链) if let errorMessage = errorMe ...

  4. swift 注意事项 (十六) —— 可选链

    可选链(Optional Chaining) 我们都知道"可选型"是什么.那么可选链又是什么,举个样例解释一下: struct MyName{      var name } st ...

  5. Swift的可选链,类型转换和扩展

    可选链(Optional Chaining) 可选链是一种请求或调用属性.方法,子脚本的过程. 可选性体现于请求或调用的目标当前可能为nil.若不为nil则成功调用.否则返回nil并将链失效. 调用可 ...

  6. Swift 可选链

    可选链(Optional Chaining)是一种可以请求和调用属性.方法和子脚本的过程,用于请求或调用的目标可能为nil. 可选链返回两个值: 如果目标有值,调用就会成功,返回该值 如果目标为nil ...

  7. js optional chaining operator

    js optional chaining operator js 可选链 可选链操作符( ?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效. ?. 操作符的功能类似于 ...

  8. Swift中的可选链与内存管理(干货系列)

    干货之前:补充一下可选链(optional chain) class A { var p: B? } class B { var p: C? } class C { func cm() -> S ...

  9. 学习Swift -- 可选链

    可空链式调用 可空链式调用是一种可以请求和调用属性.方法及下标的过程,它的可空性体现于请求或调用的目标当前可能为空(nil).如果可空的目标有值,那么调用就会成功:如果选择的目标为空(nil),那么这 ...

  10. Swift_可选链

    Swift_可选链 点击查看源码 //可选链 func test() { class Person { //可选属性可能为nil或Residence类 var residence: Residence ...

随机推荐

  1. SQL Server 2008-LinkServer操作ORACLE

    链接来源:https://www.cnblogs.com/wangyong/p/Oracle.html 最近项目有需求需要通过SQL Server2008中的数据自动更新到ORACLE中,其实,一开始 ...

  2. txt文件覆盖恢复

    1.txt文件恢复到之前保存的版本 2.电脑未重启 方式:如果你使用系统还原可以用"还原以前的版本"功能来轻松找回. 右击.txt文件-还原以前的版本-选择时间点-还原

  3. 【转】AWVS扫描小技巧

    1.文件头加 Mozilla/5.0 (compatible; Baiduspider/2.0; +http://www.baidu.com/search/spider.html) 可以绕过狗,waf ...

  4. Java线程的死锁和活锁

    目录 1.概览 2.死锁 2.1.什么是死锁 2.2 死锁举例 2.3 避免死锁 3.活锁 3.1 什么是活锁 3.2 活锁举例 3.3 避免活锁 1.概览 当多线程帮助我们提高应用性能的同时,它同时 ...

  5. 安装curl,composer

    wget https://curl.haxx.se/download/curl-7.54.1.tar.gz tar -zvxf curl-7.54.1.tar.gz cd curl-7.54.1 ./ ...

  6. ubuntu安装php的 mongodb扩展

    wget https://pecl.php.net/get/mongodb-1.2.6.tgztar -zxvf mongodb-1.2.6.tgz cd mongodb-1.2.6 /usr/bin ...

  7. 在Spring data中使用r2dbc

    目录 简介 依赖关系 数据库连接配置 数据库初始化 DAO操作 Service操作和Transaction controller 测试 简介 上篇文章我们讲到了怎么在Spring webFlux中使用 ...

  8. 【mq读书笔记】顺序消息

    注意异常情况导致整个消费无限重试 阻塞消费 mq支持局部消息顺序消费,可以确保同一个消息消费队列中的消息被顺序消费.看下针对顺序消息在整个消费过程中做的调整: 队列负载: DefaultMQPushC ...

  9. bootstrap 按钮颜色属性

    bootstrap 按钮颜色属性有几种

  10. ASP.NET Core管道详解[6]: ASP.NET Core应用是如何启动的?[下篇]

    要承载一个ASP.NET Core应用,只需要将GenericWebHostService服务注册到承载系统中即可.但GenericWebHostService服务具有针对其他一系列服务的依赖,所以在 ...