iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 9
1
Modern Web

JavaScript Note系列 第 9

「==」 & 「===」 運算子

  • 分享至 

  • xImage
  •  

「==」與「===」運算子都是用來判斷運算元的值是否相等。

「===」 嚴格比較

  • 先判斷運算元的型別是否相同,若不相同,結果為false。
  • null與undefined都跟自己相等。
  • true與false都跟自己相等。
  • NaN不等於任何值,包括自己。
  • 只要是number型別的值一樣,他們就相等。
  • 0跟-0相等。
  • string長度跟內容不一樣,包括空白,它們就不相等。
  • 如果參考至同一個物件、陣列、函式,相同的記憶體位置,他們就相等,若無,就算內容的值一樣,它們也不相等,不同的記憶體位置存相同的值。
console.log('1' === 1); //false
console.log(null === null); //true
console.log(undefined === undefined); //true
console.log(null === undefined); //false
console.log(NaN === NaN); //false
console.log(NaN !== NaN); //true
console.log('ABC' === 'ABC '); //false

「==」 寬鬆比較

  • 如果運算元相同型別,就使用嚴格比較去檢驗。
  • null跟undefined相同。
  • 運算元一個是數值,一個是字串,會將字串轉數字,再進行比較。
  • 其中一個是true或false會轉成數字的1或0,再進行比較。
  • 其中一個是物件,另一個是字串或數值,物件會先轉成基型值,再進行比較。

相等運算比較表
型別比較 | 型別 | 比較基準
------------- | -------------
相同 | string / number / boolean | 比較兩邊的值是否相等
相同 | array / object | 比較參考的目標是否相等
相同 | null / undefined | 相等於自身與對方
不同 | string / number / boolean | 將string/boolean轉型為number後比較
不同 | object | 轉型為基型值後比較

物件型別的比較

let ary1 = ['A', 'B', 'C'];
let ary2 = ['A', 'B', 'C'];
console.log(ary1 == ary2); //false
console.log(ary1 === ary2); //false

陣列是物件,屬於參考型別。意思是,陣列變數的值,不是陣列本身,而是指向陣列的記憶體位置。
上面兩個陣列是記憶體位置不同,內容相同的陣列,不管是==或是===比較的,都是變數的值,也就是記憶體位置,所以結果為false。

let ary1 = ['A', 'B', 'C'];
let ary2 = ary1;
console.log(ary1 == ary2); //true
console.log(ary1 === ary2); //true

如果ary1使用「=」運算子將值設定給ary2,也就意味著它們有相同的記憶體位置,指向同一個陣列,所以結果為true。
物件也是相同的情況:

let obj1 = {
    x: 1,
    y: 2
}
let obj2 = {
    x: 1,
    y: 2
}
let obj3 = obj1;
console.log(obj1 == obj2); //false
console.log(obj1 === obj2); //false
console.log(obj1 == obj3); //true
console.log(obj1 === obj3); //true

參考來源:
JavaScript大全
Speaking JavaScript|簡明完整的 JS 精要指南
新一代 JavaScript 程式設計精解


上一篇
undefined & null
下一篇
Array 陣列
系列文
JavaScript Note31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言