javascript 「||」、「&&」的靈活運用

你是否看到過這樣的代碼:a=a||""; 可能javascript初學者會對此感到茫然。今天就跟你們分享一下個人一些心得。 javascript

其實: java

a=a||"defaultValue";
與:
if(!a){
  a="defaultValue";
}
和:
if(a==null||a==""||a==undefined){
    a="defaultValue";
}

是等價的! 算法

爲了弄清這個問題,首先咱們必須瞭解一個問題:javascript中數據類型在轉換爲bool類型時發生了什麼。 spa

 

在javascript中,數據類型能夠分爲「真值」和「假值」。顧名思義,真值轉換爲bool時值爲true;假值轉換爲bool時值爲false。下表羅列了一些常見的數據類型轉換爲bool時的值: code

 

數據類型 轉換爲bool後的值
null FALSE
undefined FALSE
Object TRUE
function TRUE
0 FALSE
1 TRUE
0、1以外的數字 TRUE
字符串 TRUE
""(空字符串) FALSE

在if表達式中,javascript首先將條件表達式轉換爲bool類型,表達式爲真值則執行if中的邏輯,不然跳過。 ip

 

因而有了: 字符串

if(!a){
    a="defaultValue";
}

下面咱們再來看「&&」、「||」兩個表達式。 io

因爲javascript是弱類型語言,因此在javascript中這兩個表達式可能跟其餘語言(好比java)中不太同樣。 table

在javascript中,「&&」運算符運算法則以下: function

若是&&左側表達式的值爲真值,則返回右側表達式的值;不然返回左側表達式的值。

這就是說:

var i=""&&"真值";//->i=""
i="真值"&&"其餘真值";//->i="其餘真值"
i="真值"&&"";//->i=""

「||」運算符的運算法則以下:

若是||左側表達式的值爲真值,則返回左側表達式的值;不然返回右側表達式的值。

這就是說:

var i=""||"真值";//->i="真值"
i="真值"||"其餘真值";//->i="真值"
i="真值"||"";//->i="真值"
因而,就能夠理解:
a=a||"defaultValue";

的邏輯了。若是a爲假值(等於null、空字符串……),則將"defaultValue"賦給a;不然將a的值賦給a自己。

下面咱們運用||、&&來簡化程序:

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);

//等價於
result=test(parameter)?operate1(parameter):operate2(parameter);

alert(result);//真值操做

//也等價於
if(test(parameter)){
	result=operate1(parameter);
}else{
	result=operate2(parameter);
}

alert(result)//真值操做
相關文章
相關標籤/搜索