DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> Javascript 中的 && 和 || 使用小結
Javascript 中的 && 和 || 使用小結
編輯:關於JavaScript     

普通情況下的 && 和 || 比較簡單,這裡不進行討論。

准備兩個對象用於下面的討論。
復制代碼 代碼如下:
var alice = {
name: "alice",
toString: function () {
return this.name;
}
}

var smith = {
name: "smith",
toString: function () {
return this.name;
}
}

在 javascript 中,對於 && 不僅僅可以用於 boolean 類型,也不僅僅返回 Boolean 類型的結果。
l 如果第一個操作數是 Boolean 類型,而且值為 false ,那麼直接返回 false。
l 如果第一個操作數是 Boolean 類型,而且值為 true,另外一個操作數是 object 類型,那麼將返回這個對象。
l 如果兩個操作數都是 object 類型,那麼,返回第二個對象。
l 如果任何一個操作數是 null,那麼,返回 null。
l 如果任何一個操作數是 NaN,那麼返回 NaN。
l 如果任何一個操作數是 undefinded,那麼返回 undefined。


alert(false && alice); // false
alert(true && alice); // alice

alert(alice && smith); // smith
alert(smith && alice); // alice

alert(null && alice); // null
alert(NaN && alice); // NaN
alert(undefined && alice); // undefined
alert(alice && undefined); // undefined

對於 || 來說,同樣也不僅僅用於 Boolean 類型,也不僅僅返回 Boolean 類型的結果。
事實上,null、undefined、NaN 都將被看作 false。而對象被當作 true。

l 如果第一個操作數是 boolean 類型,而且值為 true, 那麼,直接返回 true。
l 如果第一個操作數是 Boolean 類型,而且值為 false ,第二個操作數為 object,那麼返回 object 對象。
l 如果兩個操作數都是 object 類型,那麼返回第一個對象。
l 如果兩個操作數都是 null,那麼,返回 null。
l 如果兩個操作數都是 NaN,那麼返回 NaN。
l 如果兩個操作數都是 undefined,那麼,返回 undefined。
alert(false || alice);         // alice

alert(true || alice);          // true

alert(alice || smith);         // alice

alert(smith || alice);         // smith

alert(null || alice);       // alice

alert(alice || null);       // alice

alert(null || null);        // null

alert(NaN || alice);        // alice

alert(alice || NaN);        // alice

alert(NaN || NaN);          // NaN

alert(undefined || alice);     // alice

alert(alice || undefined);     // alice

alert(undefined || undefined); // undefined

不用搞得這麼復雜 推薦大家看這部分的說明
a && b : 將a, b轉換為Boolean類型, 再執行邏輯與, true返回b, false返回a
a || b : 將a, b轉換為Boolean類型, 再執行邏輯或, true返回a, false返回b
轉換規則:
對象為true
非零數字為true
非空字符串為true
其他為false

相關文章可以參考下面幾篇,綜合一下
js 與或運算符 || && 妙用
js利用與或運算符優先級實現if else條件判斷表達式
javascript &&和||運算法的另類使用技巧

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved