首頁 >web前端 >js教程 >淺談javascript中相等運算子:==與===的差別

淺談javascript中相等運算子:==與===的差別

青灯夜游
青灯夜游轉載
2020-06-13 09:33:322793瀏覽

淺談javascript中相等運算子:==與===的差別

我們在程式設計的過程中,常常會遇到判斷兩個變數是否相等的情況,ECMAscript提供了兩個相等運算子」==”和”===”來判斷,這兩種操作都會回傳一個boolean值。一般來說,我們把”==”稱之為相等,稱”===”為全等。

當兩相比較的兩個變數資料類型一致時,情況比較簡單,而當運算子兩邊的變數類型不一致,甚至其中的某個變數是物件時,情況就比較複雜了,下面分別介紹當運算元不同時運算結果會怎麼樣。

全等運算子 「===」

#全等運算子」===」的情況相對來說比較簡單。當用全等運算子」===」來判斷時,先檢查運算子兩邊運算元資料型別是否一致,若不一致,則直接傳回false,否則,才進行下一步判斷。

如果是兩個boolean的比較,則”===”兩邊必須同為true或同為false,才可以返回true,否則返回false.若兩相比較的是數字,那麼只有當這兩個數字大小相等時才會回傳true,否則回傳false。

如果要比較的兩個變數是字串,先比較兩個字串的長度length是否相等,如果長度不一樣,則傳回false,如果相等,則從兩個變數的第一個字元開始比較是否相等,一直比較到最後一位;如果其中的某一位不想等,則傳回false,否則回傳true。

(注意:字串的比較是不會忽略空格的,所以在比較兩個字串是否相等時,為確保安全,應該先去除空格,然後把兩個字串同轉為大寫或小寫之後再進行比較)。

而null只有在null===null的情況下才會回傳true,其它情況都回傳false,同樣,undefined只有在undefined===undefined的情況下才會回傳true,否則回傳false 。如:

true === 1    //false
"1" === 1    //false
 
//boolean的比较
true === true  //true
true === false  //false

//string的比较
"hello" === "helloworrld" //false
"hello" === "world" //false
"hello" === " hello" //false
"hello" === "hellO" //false
"hello" === "hello" //true

//number的比较
1 === 1  //true
1 === 1.0 //true
1 === 1.2 //false

//null和undefined的比较
undefined === undefined  //true
null === null       //true
undefined === null    //false,两者在"=="时才返回true

如果進行”===”比較的兩個操作數不是基本類型值,而是兩個對象,這時候判斷依據就是,判斷這兩個變數是否是”同一個”物件

var a,b,c;
a = b = {
	name : '柳轻侯',
	city : '南京'
};
c = {
	name : '柳轻侯',
	city : '南京'
};
a === b   //true
a === c   //false

兩個物件僅僅」長得一樣」是不夠的,a和c都是Object實例,且兩者擁有相同的屬性和值,可是這兩個卻不是」同一個」對象,因為實際上a和c指向了兩個不同的實例,所以這兩個物件是不全等的。

而a和b卻指向了同一個對象,換個說法,a和b是同一個對象的不同別名,他們實際上指向的對像是完全相同的,所以a === b。 ”!==” 與 “===” 比較規則一樣,在此不再贅述。

相等運算子」==”

全等運算子在進行判斷的時候,如果兩個變數的型別不同,則直接回傳false,而與此不同,」==」相等運算子在判斷的時候,如果兩個變數的型別不同,則會做一個隱式的型別轉換,把要比較的兩個值轉換為相同的類型再做比較,那麼這種轉換規則是怎麼樣的呢?

在轉換不同資料類型時,相等和不等運算子遵循下面的基本規則

  • #如果其中一個運算元是是boolean值,則在比較之前會先將boolean值轉換為number值,true轉換為1,false轉為0;
  • 如果其中一個運算元是string類型,而另一個是number類型,在比較之前先將string型別轉換為number類型再進行判斷;
  • 在比較之前,undefined和null是不會轉為其他值進行比較的;
  • 如果其中一個運算元是對象,而另一個是基本型別值,則在比較之前先將物件轉為基本型別值,然後再依據前面的規則進行後續的比較;

兩個運算元在比較時遵循下列規則

  • undefined和null是相等的,即:undefined == null;
  • 如果有一個運算元是NaN,那麼回傳false,即使兩個運算元都是NaN,也會回傳false;
  • 如果兩個操作數是對象,則比較規則跟”===”的比較規則是一樣的,除非這兩個操作數是同一個對象,則返回true,否則返回false;

這裡要注意的是,NaN == NaN是傳回false的,NaN意思是not a number,也就是說該運算元是一個非數字,這個非數字是不確定的,它的值是未知的,甚至可能根本就不能用javascript的語法表示出來,這樣一個未知量是不能用來進行特定比較的,兩個未知的東西,如果不能確定它的值是什麼,當然不能說NaN == NaN。

那麼既然不能用」==」來比較,我們怎麼去判定一個變數是不是NaN呢,既然不能用相等來判定,那麼不妨反其道而行之,用」!=」來判定,判定一個變數是否不等於NaN。例如:

//如果需要判定一个变量是不是NaN,可以如下
//a是你需要判定的变量
if((typeof a === "number") && a != NaN ){  //此处需要注意,NaN也是number类型
	//TODO 
}

常見比較情況及其結果

null == undefined  // true 
"NaN" == NaN    // false 
5 == NaN      // false 
NaN == NaN     // false 
NaN != NaN     // true 
false == 0     // true 
true == 1      // true 
true == 2      // false 
undefined == 0   // false 
null == 0      // false
"5" == 5      // true

典型範例解析

![] == [] //true

这是一道比较容易令人困惑的题,按照正常的思维模式,对一个操作数逻辑取反,跟这个操作数本身的值是相对的,如果这个操作数本身的值是true,那么取反之后就是false,反之,如果这个操作数的值是false,那么对其逻辑取反之后就是true,无论如何也不会是同一个值,可是事实上却是![] == []。

首先,![]的值是false,因为这里[]被当成了一个数组的实例,是一个对象,而对象都是真值,对其取反,得到一个假值,也就是false。

其次看等号右边,[]是一个对象,要将其转为基本类型值,会先调用数组的valueOf方法,而数组的valueOf方法返回数组本身,没有得到一个基本值。

这时候要继续调用数组的toString方法,得到一个””空字符串,所以这时候也就变成了false == “”是否为真的问题了,而根据前面的规则,如果有一个操作数为boolean值,会将其转为数值,false转化为0。

进而,问题转化为0 == “”是否为真值的问题,当number和string比较时,会将string转为number,而””会转为0。最后,问题变演化成了0 == 0是否为真值,毋庸置疑,结果是true。

这里要注意的就是![],它被当成了一个整体的逻辑值,是直接对对象进行取反,是一个假值,而不是先把[]转化为基本值再取反

小结

“==”在比较不同类型值得时候会进行隐式的类型转化,而”===”不会转化,全等一定相等,相等却不一定全等,这是一个充分不必要条件。

undefined和null相等而不全等,且在相等比较的时候不会转化为其他类型的值。NaN是不等于NaN 的,要判断某个变量是不是NaN,要用”!=”。对象和非对象在进行比较的时候会先转为基本类型值然后再根据上面的规则进行比较。

推荐教程:《JS教程

以上是淺談javascript中相等運算子:==與===的差別的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:jb51.net。如有侵權,請聯絡admin@php.cn刪除