總結(jié)JavaScript中布爾操作符||與&&的使用技巧
你是否看到過(guò)這樣的代碼:a=a||""; 可能javascript初學(xué)者會(huì)對(duì)此感到茫然。今天就跟大家分享一下我的一些心得。
其實(shí):
a=a||"defaultValue"; a=a||"defaultValue";
與:
if(!a){
a="defaultValue";
}
if(!a){
a="defaultValue";
}
和:
if(a==null||a==""||a==undefined){
a="defaultValue";
}
if(a==null||a==""||a==undefined){
a="defaultValue";
}
是等價(jià)的!
為了弄清這個(gè)問(wèn)題,首先我們必須了解一個(gè)問(wèn)題:javascript中數(shù)據(jù)類型在轉(zhuǎn)換為bool類型時(shí)發(fā)生了什么。
在javascript中,數(shù)據(jù)類型可以分為“真值”和“假值”。顧名思義,真值轉(zhuǎn)換為bool時(shí)值為true;假值轉(zhuǎn)換為bool時(shí)值為false。下表羅列了一些常見(jiàn)的數(shù)據(jù)類型轉(zhuǎn)換為bool時(shí)的值:
在if表達(dá)式中,javascript首先將條件表達(dá)式轉(zhuǎn)換為bool類型,表達(dá)式為真值則執(zhí)行if中的邏輯,否則跳過(guò)。
于是有了:
if(!a){
a="defaultValue";
}
if(!a){
a="defaultValue";
}
下面我們?cè)賮?lái)看“&&”、“||”兩個(gè)表達(dá)式。
由于javascript是弱類型語(yǔ)言,所以在javascript中這兩個(gè)表達(dá)式可能跟其他語(yǔ)言(比如java)中不太一樣。
在javascript中,“&&”運(yùn)算符運(yùn)算法則如下:
如果&&左側(cè)表達(dá)式的值為真值,則返回右側(cè)表達(dá)式的值;否則返回左側(cè)表達(dá)式的值。
這就是說(shuō):
var i=""&&"真值";//->i="" i="真值"&&"其他真值";//->i="其他真值" i="真值"&&"";//->i="" var i=""&&"真值";//->i="" i="真值"&&"其他真值";//->i="其他真值" i="真值"&&"";//->i=""
“||”運(yùn)算符的運(yùn)算法則如下:
如果||左側(cè)表達(dá)式的值為真值,則返回左側(cè)表達(dá)式的值;否則返回右側(cè)表達(dá)式的值。
這就是說(shuō):
var i=""||"真值";//->i="真值" i="真值"||"其他真值";//->i="真值" i="真值"||"";//->i="真值" var i=""||"真值";//->i="真值" i="真值"||"其他真值";//->i="真值" i="真值"||"";//->i="真值"
于是,就可以理解:
a=a||"defaultValue"; a=a||"defaultValue";
的邏輯了。如果a為假值(等于null、空字符串……),則將"defaultValue"賦給a;否則將a的值賦給a本身。
下面我們運(yùn)用||、&&來(lái)簡(jiǎn)化程序:
var parameter="";
function test(parameter){
//return 真值
return true;
}
//真值操作
function operate1(parameter){
return "真值操作";
}
//假值操作
function operate2(parameter){
return "假值操作";
}
var result=test(parameter)&&operate1(parameter);
result=test(parameter)||operate2(parameter);
//等價(jià)于
result=test(parameter)?operate1(parameter):operate2(parameter);
alert(result);//真值操作
//也等價(jià)于
if(test(parameter)){
result=operate1(parameter);
}else{
result=operate2(parameter);
}
alert(result)//真值操作
再比如:
<script language="javascript" type="text/javascript"> var a =1; var b = 0; var c = 3; var d = a && b && c; window.alert(d); </script>
輸出了d的值為0,如果把d的值改為不等于0的值,那么d將始終是3
所以js中的&&返回的是第一個(gè)不為真的值即是0(對(duì)象亦可),如果全部都是真那么返回的最后一個(gè)值。
<script language="javascript" type="text/javascript"> var a =0; var b = 3; var c = 5; var d = a || b || c; window.alert(d); </script>
輸出了d的值為3,如果把b的值改為0,那么d將始終是5.如果全部都改為0,那么d的值是0.</p><p>所以js中的||返回的是第一個(gè)不為false的值即是0(對(duì)象亦可),如果全部都是false那么返回的最后一個(gè)值。
應(yīng)用:
比如要簡(jiǎn)單的驗(yàn)證郵箱格式,只有‘@''和‘.''都同時(shí)存在是才算格式正確,否則提示錯(cuò)誤:
該用哪個(gè)呢?讓我們分析一下:
if (form1.elements[3].value.indexOf("@",0)==-1 && form1.elements[3].value.indexOf(".",0)==-1){ alert("EMAIL地址輸入錯(cuò)誤!")}
如果都存在:&&兩邊都是假。&&返回第一個(gè)為真的值,所以if判斷條件是假if后面的語(yǔ)句不執(zhí)行!不會(huì)提示用戶。
只有至少@和。存在一個(gè)的是時(shí)候if的條件才為真,才提示用戶錯(cuò)誤。
兩個(gè)都存在的時(shí)候,返回最后一個(gè)的值,是真 if判斷條件成立if語(yǔ)句執(zhí)行。提示用戶錯(cuò)誤。
所以用&&明顯錯(cuò)誤!
要換成
if (form1.elements[3].value.indexOf("@",0)==-1 || form1.elements[3].value.indexOf(".",0)==-1){ alert("EMAIL地址輸入錯(cuò)誤!") }
分析:
如果兩個(gè)都存在:全部為false,返回是false 所以if條件不成立,語(yǔ)句不執(zhí)行,不提示錯(cuò)誤!
如果只有一個(gè)存在:返回第一個(gè)不為false的值。返回為true 提示錯(cuò)誤!
兩個(gè)都不存在:返回第一個(gè)不為false的值,返回是true 提示錯(cuò)誤!
所以應(yīng)該用||
相關(guān)文章
重置Redux的狀態(tài)數(shù)據(jù)的方法實(shí)現(xiàn)
這篇文章主要介紹了重置Redux的狀態(tài)數(shù)據(jù)的方法實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11
JS實(shí)現(xiàn)自動(dòng)閱讀單詞(有道單詞本添加功能)
有道單詞客戶Duan沒(méi)有自動(dòng)閱讀的功能, 本文用強(qiáng)大的js實(shí)現(xiàn)了簡(jiǎn)單的自動(dòng)下一個(gè)單詞的功能,需要的朋友可以參考下2016-11-11
阻止mousemove鼠標(biāo)移動(dòng)或touchmove觸摸移動(dòng)觸發(fā)click點(diǎn)擊事件
這篇文章主要為大家介紹了阻止mousemove或touchmove與click事件同時(shí)觸發(fā)技巧,一個(gè)按鈕綁定了多個(gè)事件,所以就要想辦法阻止 mouse 鼠標(biāo)事件或 touch 觸摸事件 與 click 事件同時(shí)觸發(fā),不然每次拖拽按鈕后都會(huì)觸發(fā) click 事件,這顯然是不友好的2023-06-06
Markdown+Bootstrap圖片自適應(yīng)屬性詳解
這篇文章主要為大家詳細(xì)介紹了Markdown+Bootstrap圖片自適應(yīng)屬性,感興趣的朋友可以參考一下2016-05-05
javascript根據(jù)時(shí)間生成m位隨機(jī)數(shù)最大13位
javascript根據(jù)時(shí)間生成m位隨機(jī)數(shù),最大13位隨機(jī)數(shù),并且不能保證首位不為0,實(shí)現(xiàn)代碼如下,需要的朋友可以參考下2014-10-10

