第一步 安装
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. 使用electron+vue开发一个跨平台todolist(便签)桌面应用

    # 1 最近一直在使用electron开发桌面应用,对于一个web开发者来说,html+javascript+css的开发体验让我非常舒服.之前我一直简单的以为electron只是张网页加个壳,和那些 ...

  2. Hadoop框架:MapReduce基本原理和入门案例

    本文源码:GitHub·点这里 || GitEE·点这里 一.MapReduce概述 1.基本概念 Hadoop核心组件之一:分布式计算的方案MapReduce,是一种编程模型,用于大规模数据集的并行 ...

  3. First day,beginning!

    beginning 在闲暇的时光记录当下的生活,一直是自己所期盼的: 由于种种原因(懒惰),一直未能开始,那么就从今天开始吧! 看下日期,从实习到现在一个月刚刚好: 公司很不错,师傅特别好,感觉自己是 ...

  4. html页面转PDF、图片操作记录

    前言 日常开发中,我们有可能会碰到从系统中导出数据并打印的需要,打印的格式是常规的表格形式,例如: 本文记录使用js库html2canvas + jspdf实现html转PDF.图片,并下载 画出页面 ...

  5. 经历与感想丨第15届CSUST-ACM程序大赛

    这算是我的第一次较正式的\(ACM\)团队比赛吧,真的感谢@dj.@qc两位大佬. 开局就选了最后一题(因为哈希是他们集训队的猫),但三人无啥思路,于是溜回A题(发现有不少人已经过了).dj很快进入状 ...

  6. CSS3 学习笔记(上)

    一.CSS简介 CSS(Cascading Style Sheets)层叠样式表.其中,样式定义为如何显示HTML元素,它通常储存在样式表,将样式添加到HTML中,能够解决内容与表现分离的问题.由于网 ...

  7. 一万三千字的HashMap面试必问知识点详解

    目录 概论 Hasmap 的继承关系 hashmap 的原理 解决Hash冲突的方法 开放定址法 再哈希法 链地址法 建立公共溢出区 hashmap 最终的形态 Hashmap 的返回值 HashMa ...

  8. 现代富文本编辑器Quill的模块化机制

    DevUI是一支兼具设计视角和工程视角的团队,服务于华为云DevCloud平台和华为内部数个中后台系统,服务于设计师和前端工程师.官方网站:devui.designNg组件库:ng-devui(欢迎S ...

  9. DFS文件服务器实验手册

    基础配置信息清单 计算机名 角色 网络配置 DNS WIN-6E DC 11.1.1.10/24 127.0.0.1 WIN-C4 Node1 11.1.1.20/24 11.1.1.10 WIN-4 ...

  10. JDk8的新特性-流和内部iteration

    JDK8到今天已经出了好几年了  但是在公司能用到新特性的地方还是很少, 去年的时候当时项目老大要求我们用最新的写法来写Java 刚开始看到用stream写出来的代码一脸懵逼,内心就在想  这是Jav ...