可选链plugin-proposal-optional-chaining的使用

Posted 2020-11-15 ayujun

第一步 安装
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=>{
            //...
        })