JavaScript邏輯運算符的使用技巧

前言

!, &&, || 三個運算符是JavaScript中重要的邏輯運算符，本文將介紹這三個運算符在JavaScript實際編程中的有趣使用技巧。

取反運算符（!）

若是對一個值連續作兩次取反運算，等於將其轉爲對應的布爾值，與Boolean函數的做用相同。

!!x
// 等同於Boolean(x)
複製代碼

兩次取反就是將一個值轉爲布爾值的簡便寫法。

var str='test';
var bl=!!str;
bl 
// true

Boolean(str)
// true
複製代碼

且運算符（&&）

且運算符的運算規則是：若是第一個運算子的布爾值爲true，則返回第二個運算子的值（注意是值，不是布爾值）；若是第一個運算子的布爾值爲false，則直接返回第一個運算子的值，且再也不對第二個運算子求值。

咱們能夠利用這個運算規則取代if結構，好比下面是一段if結構的代碼，就能夠用且運算符改寫。

if (i) {
  doSomething();
}

// 等價於

i && doSomething();
複製代碼

這種跳過第二個運算子的機制，被稱爲「短路」。

或運算符（||）

或運算符的運算規則是：若是第一個運算子的布爾值爲true，則返回第一個運算子的值，且再也不對第二個運算子求值；若是第一個運算子的布爾值爲false，則返回第二個運算子的值。

var x = 1;
true || (x = 2) // true
x // 1
複製代碼

短路規則對這個運算符也適用。

function saveText(text) {
  text = text || 'test';
  // ...
}

// 或者寫成
saveText(this.text || 'test')
複製代碼

利用短路規則，或運算符能夠爲一個變量設置默認值。