在es11中，增加了我最喜欢，也在工作中经常使用的语法 空值合并操作符 和 可选链操作符，可能还有人是第一次知道，或者是看别人的代码写过，但是却不知道这语法叫什么，有什么作用？这篇文章已经帮你记录了！
空值合并操作符（??）
空值合并操作符是一个逻辑操作符，当左侧的值为null或者是undefined时，返回右侧的值，否则返回左侧的值
举例：
let name = null ?? '小明'
let age = undefined ?? 18
console.log(name) //小明
console.log(age) //18这个时候你可能心里就会产生一问，这个 ?? 和 || 没什么区别啊，别急下面继续看
let num1 = 0 ?? 18
let num2 = 0 || 18
console.log(num1) //0
console.log(num2) //18
let str1 = '' ?? 'abc'
let str2 = '' || 'abc'
console.log(str1) // ''
console.log(str2) // abc
let bol1 = false ?? true
let bol2 = false || true
console.log(bol1) //false
console.log(bol2) //true我们 使用 ?? 和 || 进行比较，左右侧值一样，可以看出，得到的结果完全是反着来的，那么我们就可以得出一个结论
||:在左侧为假值的时候，我们就返回右侧的值，什么是假值？例null,undefined,0,'',false,NaN
??:在左侧为null或者undefined的时候，返回右侧的值，否侧就返回左侧的值
注意：当 ?? 和 &&或者|| 连在一起用时，是不被允许的，会给你报错成 SyntaxError之类的
let data = null || undefined ?? 'xiaomi'可选链操作符( ?. )
允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。
?.操作符的功能类似于 . 链式操作符，不同之处在于，在引用为 null 或者 undefined 的情况下不会引起错误该表达式短路返回值是 undefined。与函数调用一起使用时，如果给定的函数不存在，则返回 undefined
可能还是不太懂哈，我举个例子，应该每个前端人可能多多少少都写过，以vue举例
<div v-if="userInfo && userInfo.user && userInfo.user.name">{{userInfo.user.name}}</div>
userInfo:{}这种代码我觉肯定写过，，因为我们不知道userInfo中有几层数据，导致我们取深层数据的时候，如果不这么写，会给你报什么Cannot read property undefined之类的错误，当然还有一种解决办法，就是给默认值
<div v-if="userInfo.user.name">{{userInfo.user.name}}</div>
userInfo:{user:{name:''}}假如后台给你返回的是这些个字段，而且还有很多字段属性都没有写出来，我们不可能都去写出来然后给个默认值，显然是不合理的
let userInfo = {
user: {
name: '小明',
age: 18,
gender: '男',
phone: '18412345678',
getUserMessage() {
return '123456'
}
}
}这个时候就需要
let userName = userInfo && userInfo.user && userInfo.user.name //虽然可行，但是繁琐
console.log(userName)
let age = userInfo?.user?.age //?. 这么写就行
console.log(age) //18
let num = userInfo?.user?.getUserMessage()
console.log(num) //123456
let hobby1 = userInfo && userInfo.user && userInfo.user.hobby //找一个不存在属性
console.log(hobby1) //undefined
let hobby2 = userInfo?.user?.hobby //找一个不存在属性
console.log(hobby2) //undefined
let field = 'phone'
let phone = userInfo?.user?.[field]
console.log(phone) //184123456还可以找数组
let arr = [0, 1, 2, 3, 4, 5, 6]
let item = arr?.[3]
console.log(item) //3
let item1 = arr?.[999]
console.log(item1) //undefined 并没有索引值999的值还可以跟 ?? 进行结合
let city = userInfo?.user?.city ?? '洛阳'
console.log(city) //洛阳有木有感觉很实用呢？还没有用过的小伙伴快点用起来吧，让你的代码简洁风骚起来
