一喉钢、可選鏈運(yùn)算符?. (IE瀏覽器不兼容)
?.運(yùn)算符功能類(lèi)似于 .運(yùn)算符整葡，不同之處在于如果鏈條上的一個(gè)引用是nullish(null或undefined)件余，. 操作符會(huì)引起一個(gè)錯(cuò)誤，?.操作符取而代之的是會(huì)按照短路計(jì)算的方式返回一個(gè)undefined遭居。當(dāng)?.操作符用于函數(shù)調(diào)用時(shí)啼器，如果該函數(shù)不存在也將會(huì)返回 undefined。
1.語(yǔ)法
obj?.prop
obj?.[表達(dá)式]
arr?.[index]
func?.(args)
// obj?.prop 舉例
let obj = {
params:{
id:1,
val:2
}
}
console.log(obj.params.id) // 1
console.log(obj.params?.id) // 1
// 假如 obj.params是null
console.log(obj.params.id) // Error: Cannot read property 'id' of null
console.log(obj.params?.id) // undefined
// obj.params?.id 相當(dāng)于(obj.params=== null || obj.params === undefined) ? undefined : obj.params.id
// arr?.[index]同理,數(shù)組arr如果是null, 可選鏈可以自動(dòng)返回undefined而不是拋出一個(gè)異常俱萍。
// obj?.[表達(dá)式] 舉例
let class1= {
student1:"小明",
student2:"小芳",
student3:"小強(qiáng)"
}
function dianming(num) {
console.log(class1?.['student'+num])
}
dianming(1) // 小明
//func?.(args) 舉例
let say = {
apple:()=>{ return "我是蘋(píng)果"},
banana:()=>{ return "我是香蕉"},
cherry:()=>{ return "我是車(chē)?yán)遄?}
}
console.log(say.apple()) // 我是蘋(píng)果
console.log(say.banana()) // 我是香蕉
console.log(say.cherry()) // 我是車(chē)?yán)遄?console.log(say.yohoo()) // Error: say.yohoo is not a function
console.log(say.yohoo?.()) // undefined
//函數(shù)調(diào)用時(shí)如果被調(diào)用的方法不存在端壳，使用可選鏈可以使表達(dá)式自動(dòng)返回undefined而不是拋出一個(gè)異常。
2.可選鏈在賦值時(shí)無(wú)效
let object = {};
object?.property = 1; // Uncaught SyntaxError: Invalid left-hand side in assignment
3.疊加可選鏈操作符
let obj = {
name:'obj',
params:{
id:1,
value:2
}
}
console.log(obj?.params?.id) // 1
console.log(obj?.params?.count) //undefined
console.log(obj?.query?.id) //undefined
4.短路
可選鏈運(yùn)算符枪蘑，只要左側(cè)遇到無(wú)效值损谦，右側(cè)運(yùn)算就會(huì)停止，這種情況稱(chēng)為短路岳颇。
const nothing = null;
let index = 0;
nothing?.[index++]; // undefined
index; // 0
二照捡、空值合并運(yùn)算符??
??是一個(gè)邏輯運(yùn)算符，當(dāng)左側(cè)操作數(shù)是null或者undefined時(shí)话侧，會(huì)返回右側(cè)操作數(shù)栗精；否則則返回左側(cè)操作數(shù)。
與邏輯或||操作符不同瞻鹏，邏輯或會(huì)在左操作數(shù)為 假值(比如悲立，0 NaN或者‘’)時(shí)返回右側(cè)操作數(shù)。
1.語(yǔ)法
// 左側(cè)表達(dá)式為 null 或 undefined 時(shí)返回右側(cè)的表達(dá)式
leftExpr ?? rightExpr
let myText = '';
let txt1 = myText || 'Hello'
console.log(txt1) // Hello
let txt2 = myText ?? 'Hello'
console.log(txt2) // ''
2.短路
當(dāng)左表達(dá)式不為null或undefined時(shí)新博，不會(huì)對(duì)右表達(dá)式進(jìn)行求值薪夕。
let a = undefined
let b = false
let c = 123
console.log( a ?? c) // 123
console.log( b ?? c) // false
3.不能與AND 或 OR 操作符共用
直接與 AND（&&）和 OR（||）操作符組合使用 ?? 是不可取的。
null || undefined ?? "foo"; // raises a SyntaxError
true || undefined ?? "foo"; // raises a SyntaxError
