JS中的 && 、|| 、??、?. 運算符

• 2022 年 5 月 5 日
• 筆記
• javascript

javascript有不少好用的運算符，合理的使用可以大大提高工作效率，以下簡單介紹了4種，具體如下：

&&

邏輯與運算（&&）是 AND 布爾操作。只有兩個操作數都為 true 時，才返回 true，否則返回 false。具體描述如表所示:

邏輯與是一種短路邏輯，如果左側表達式為 false，則直接短路返回結果，不再運算右側表達式。運算邏輯如下：

1. 計算第一個操作數（左側表達式）的值。
2. 檢測第一個操作數的值。如果左側表達式的值可轉換為 false（如 null、undefined、NaN、0、""、false），那麼就會結束運算，直接返回第一個操作數的值。
3. 如果第一個操作數可以轉換為 true，則計算第二個操作數（右側表達式）的值。
4. 返回第二個操作數的值。

實例：

let a = 10
(a > 5) && console.log('哈哈哈'); // 哈哈
等效於：
if(x> 5) {
	console.log('哈哈');
}

||

邏輯或運算(||)是布爾 OR 操作。如果兩個操作數都為 true，或者其中一個為 true，就返回 true，否則就返回 false。具體如圖所示:

邏輯或也是一種短路邏輯，如果左側表達式為 true，則直接短路返回結果，不再運算右側表達式。運算邏輯如下：

1. 計算第一個操作數（左側表達式）的值。
2. 檢測第一個操作數的值。如果左側表達式的值可轉換為 true，那麼就會結束運算，直接返回第一個操作數的值。
3. 如果第一個操作數可以轉換為 false，則計算第二個操作數（右側表達式）的值。
4. 返回第二個操作數的值。

??

空值合併運算符（ ?? ）是一個邏輯操作符，如果左側的表達式為 null 或者 undefined 時，返回其右側表達式，否則返回左側表達式。
下列表格中的true、false 表示除null undefined 之外任意

?.

可選鏈操作符( ?. )允許讀取位於連接對象鏈深處的屬性的值，而不必明確驗證鏈中的每個引用是否有效。( ?. ) 操作符的功能類似於( . )鏈式操作符，不同之處在於，在引用為空(nullish ) (null 或者 undefined) 的情況下不會引起錯誤，該表達式短路返回值是 undefined。與函數調用一起使用時，如果給定的函數不存在，則返回 undefined。

const obj={
	name:'張三',
	age:12
}
console.log(obj ?. name); // 張三
console.log(obj ?. xxxxx); // undefined

下表承接上面數據：