1、npm安装

npm install  @babel/plugin-proposal-optional-chaining // 可选链运算符 ?.
npm install @babel/plugin-proposal-nullish-coalescing-operator // 空值合并运算符 ??


2、配置label.config.js
module.exports = {
plugins: [
'@babel/plugin-proposal-optional-chaining', // 可选链运算符 ?.
'@babel/plugin-proposal-nullish-coalescing-operator' // 空值合并运算符 ??
]
}

 3、应用

  3.1  可选链  ?.

// 读取连接对象链的深处的属性值。

// 函数引用
let res = parent ?. myFn ?. () // parent若存在myFn方法则调用 // 表达式
let res = parent ?. [`item-${index}`] // 访问数组项
let res = parent ?. list ?. [2] // 访问parent属性list中的下标为2的值

// 设置默认值
let res = parent ?. sex ?? '男' // 取parent的sex属性值,若不存在(undefined)则默认值为'男'

  3.2  空值合并  ??

// 左侧为 null / undefined 返回右侧值;否则返回左侧值。

const v1 = null ?? 'name'    // 'name'
const v2 = 0 ?? 12 // 0
const v3 = undefined ?? 0 // 0
const v4 = undefined ?? null // null
const v5 = 10 ?? null // 10
const v6 = '' ? 'HAHA' // ''

可选链运算符、空值合并运算符 --应用到vue项目的更多相关文章

  1. js 可选链 & 空值合并 In Action

    js 可选链 & 空值合并 In Action const obj = { props: { name: 'eric', }, // prop, 不存在的属性 ️ }; console.log ...

  2. ES2020 系列:可选链 "?." 为啥出现,我们能用它来干啥?

    可选链 "?." 可选链 ?. 是一种访问嵌套对象属性的安全的方式.即使中间的属性不存在,也不会出现错误. "不存在的属性"的问题 如果你才刚开始读此教程并学习 ...

  3. ?.可选链操作符( ?. ) 可选链运算符可防止抛出 TypeError: Cannot read property ’xxx' of undefined。

    可选链操作符( ?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效.?. 操作符的功能类似于 . 链式操作符,不同之处在于,在引用为空(nullish ) (null ...

  4. PHP NULL 合并运算符

    HP 7 新增加的 NULL 合并运算符(??)是用于执行isset()检测的三元运算的快捷方式. NULL 合并运算符会判断变量是否存在且值不为NULL,如果是,它就会返回自身的值,否则返回它的第二 ...

  5. PHP中的null合并运算符

    project: blog target: null-coalesce-operator-in-php.md date: 2015-12-30 status: publish tags: - Null ...

  6. 巧用 .NET 中的「合并运算符」获得 URL 中的参数

    获取 URL 中的 GET 参数,无论用什么语言开发网站,几乎是必须会用到的代码.但获取 URL 参数经常需要注意一点就是要先判断是否有这个参数存在,如果存在则取出,如果不存在则用另一个值.这个运算称 ...

  7. 要注意null合并运算符的优先级比+还要低

    博客搬到了fresky.github.io - Dawei XU,请各位看官挪步.最新的一篇是:要注意null合并运算符的优先级比+还要低.

  8. PHP——??空合并运算符和?:三元运算符

    前言 在上一篇随笔,用三元运算符简单写的一个东西,引发了对他的兴趣,所以打算研究下. PHP7的新特性: https://php.net/manual/zh/migration70.new-featu ...

  9. C# 空合并运算符 ??

    C#语言中,??运算符称为空合并运算符: a??b形式的空合并表达式要求a为可以为null的类型或引用类型.如果a为非null,则a??b的结果为a:否则,结果为b.仅当a为null时,该操作才计算b ...

随机推荐

  1. Linux进程理解与实践(二)僵尸&孤儿进程 和文件共享

    孤儿进程与僵尸进程 孤儿进程: 如果父进程先退出,子进程还没退出那么子进程的父进程将变为init进程.(注:任何一个进程都必须有父进程) [cpp] view plaincopy #include & ...

  2. Git 使用revert回滚已提交的commit

    在git使用中如果提交错误的代码至远程服务器,可以使用git revert 命令回滚单次commit并且不影响其他commit. 回滚最新一次的提交记录: git revert HEAD 回滚前一次的 ...

  3. rabbitMQ批量删除指定的队列

    首先进入到rabbitmq目录下的sbin目录 方法1: ./rabbitmqctl list_queues| grep helloQueue | awk '{print $1}' | xargs - ...

  4. Windows提权小结

    摸鱼的时候,想想内网这部分还有什么地方适合水一下,翻翻往期,开始填坑 总结一下Windows提权的部分,以后有时间再补一下Linux提权 这仍然是一篇思路总结类的随笔,具体细节内容不展开,也展开不了. ...

  5. noip42

    T1 朴素dp很好想,设 \(dp_{u,0/1}\) ,表示以 \(u\) 为根的子树,选/不选 \(u\) 所产生的最大贡献. 转移方程则有, \[dp_{u,0} = \prod_{v\in s ...

  6. NOIP 模拟 $34\; \rm Equation$

    题解 \(by\;zj\varphi\) 发现每个点的权值都可以表示成 \(\rm k\pm x\). 那么对于新增的方程,\(\rm x_u+x_v=k\pm x/0\) 且 \(\rm x_u+x ...

  7. C# Monitor.Wait() 源码追踪 (转载)

    source: 释放对象上的锁并阻止当前线程,直到它重新获取该锁. 如果已用指定的超时时间间隔,则线程进入就绪队列. 可以在等待之前退出同步上下文的同步域,随后重新获取该域. [SecuritySaf ...

  8. C#多线程---Task实现异步

    一.场景 使用Task来进行累加操作. 二.例子-Task使用 1 using System; 2 using System.Collections.Generic; 3 using System.L ...

  9. QT 中的模态和非模态对话框

    void MainWindow::on_pushButton_clicked() { //模态 QDialog dlg(this); dlg.resize(100,100); dlg.exec(); ...

  10. Linux中增加组和用户

    新服务器增加用户: 1.创建一个新的组, groupadd oracle 2.useradd 命令用于建立用户账号(-g 指定用户所属的群组) useradd -g oracle oracle 3.再 ...