可選鍊操作符
可選鍊操作符(
?.
)允許讀取位于連接配接對象鍊深處的屬性的值,而不必明确驗證鍊中的每個引用是否有效。
通過連接配接的對象的引用或函數可能是
undefined
或
null
時,可選鍊操作符提供了一種方法來簡化被連接配接對象的值通路。
當嘗試通路可能不存在的對象屬性時,可選鍊操作符将會使表達式更短、更簡明。
Example:
let nestedProp = obj.first && obj.first.second;
為了避免報錯,在通路
obj.first.second
之前,要保證
obj.first
的值既不是
null
,也不是
undefined
。如果隻是直接通路
obj.first.second
,而不對
obj.first
進行校驗,則有可能抛出錯誤。
有了可選鍊操作符(
?.
),在通路
obj.first.second
之前,不再需要明确地校驗
obj.first
的狀态,再并用短路計算擷取最終結果:
let nestedProp = obj.first?.second;
通過使用
?.
操作符取代
.
操作符,JavaScript 會在嘗試通路
obj.first.second
之前,先隐式地檢查并确定
obj.first
既不是
null
也不是
undefined
。如果
obj.first
是
null
或者
undefined
,表達式将會短路計算直接傳回
undefined
。
空值合并運算符
空值合并操作符(
??
)是一個邏輯操作符,當左側的操作數為
null
或者
undefined
時,傳回其右側操作數,否則傳回左側操作數。
||
是一個布爾邏輯運算符,左側的操作數會被強制轉換成布爾值用于求值。任何假值(
,
''
,
NaN
,
null
,
undefined
)都不會被傳回。
??
const nullValue = null;
const emptyText = ""; // 空字元串,是一個假值,Boolean("") === false
const someNumber = 42;
const valA = nullValue ?? "valA 的預設值";
const valB = emptyText ?? "valB 的預設值";
const valC = someNumber ?? 0;
console.log(valA); // "valA 的預設值"
console.log(valB); // ""(空字元串雖然是假值,但不是 null 或者 undefined)
console.log(valC); // 42
||
let count = 0;
let text = "";
let qty = count || 42;
let message = text || "hi!";
console.log(qty); // 42,而不是 0
console.log(message); // "hi!",而不是 ""
更多 - 可選鍊
更多 - 空值合并運算符