判斷方法:1、利用相等運算子「==」或「===」;2、利用陣列中的toString()方法;3、利用「Object.is()」方法;4 、先利用「JSON.stringify()」將物件或陣列轉為字串類型,然後使用「===」進行相等比較。
本教學操作環境:windows7系統、ECMAScript 6版、Dell G3電腦。
判斷變數是否相等,大致上有以下一些方式
==
以及===
;toString
方法;ES6
中的Object.is
方法;JSON.stringify
#,轉換為String
類型來比較;##== 及
===
#==為轉換型別比較運算符,
===為嚴格比較運算符,在資料型別相同的情況下,使用
==一般不會造成問題。
let num = 5; let num2 = 5; num == num2;//true num === num2;//true
==會做一些隱性的型別轉換。
let num = 5; let str = '5'; num == str;//true num === str;//false '' == false;//true '' === false;//false null == undefined;//true null === undefined;//false
不易發現的bug,所以還是更建議使用
===#來進行比較,這也是
TS之所以流行的原因之一。
===比較引用型別時,會存在一定的限制。
let a = {xx: 1}; let b = a; a === b;//true let c = {xx: 1}; let d = {xx: 1}; c === d;//false
===比較的是變數的參考是否相同,
而非值,當引用不同時,就會回傳
false。
===並不是一枚無往不利的銀彈,在比較物件是否相等時,還需要藉助其他更可靠的方法。
javascript高階教學】
#Array toString方法
前端給後端傳參時,後端有時會要求多個參數,隔開,
Array toString方法就比較有用了,這方法也能用來當作陣列比較。
let arr = [1,3,5,7,9]; let arr2 = [1,3,5,7,9]; arr.toString() === arr2.toString();//true "1,3,5,7,9"
null、
undefined、
object、
function等,否則容易出錯,如下
[1,3,5,[2,4,6]].toString();//"1,3,5,2,4,6" [1,null,undefined,'',2].toString();//"1,,,,2" [{xx:2},window,1,2].toString();//"[object Object],[object Window],1,2"
#Object.is方法
##Object. is是ES6新增的方法,與===
非常類似,同樣用來比較兩個值是否相等。 <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;">Object.is(1,1);//true
Object.is(&#39;str&#39;,&#39;str&#39;);//true
Object.is({},{});//false</pre><div class="contentsignin">登入後複製</div></div>
不同的是在判斷
和-0
、NaN
和NaN
時的差異。 <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;">+0 === -0 //true
NaN === NaN //false
Object.is(+0, -0) //false
Object.is(NaN, NaN) //true</pre><div class="contentsignin">登入後複製</div></div>
在處理相容性問題時,polyfill可以這樣寫。
if (!Object.is) { Object.is = function(x, y) { if (x === y) { // 针对+0 不等于 -0的情况 return x !== 0 || 1 / x === 1 / y; } else { // 针对NaN的情况 return x !== x && y !== y; } }; }
JSON.stringify
#JSON.stringify方法用來把物件或陣列轉換為一個JSON字串,所得的字串便可以用作物件的比較。 <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;">let obj = {name: &#39;lin&#39;, age: 24};
let obj2 = {name: &#39;lin&#39;, age: 24};
obj === obj2;//false
JSON.stringify(obj) === JSON.stringify(obj2);//true</pre><div class="contentsignin">登入後複製</div></div></p>JSON.stringify<p>彌補了<code>===
無法準確比較物件的限制,不過它也有一定的局限性,在遇到undefined
、function
以及symbol
值時會忽略。 另外,值得一提的是利用
、JSON.stringify
可實現物件深拷貝,局限性同上。
何時使用它們不一樣的場景可能有不一樣的需求,如果只比較基本資料類型,那麼
===就足夠了,如果想“一勞永逸
”,那麼付出一定的成本使用自訂方法無疑是有必要的。 在日常反覆的開發中,還是要多多探索吧。
更多程式相關知識,請造訪:
程式設計影片以上是javascript怎麼判斷變數是否相等的詳細內容。更多資訊請關注PHP中文網其他相關文章!