<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
/*1.隱式類型轉換：
1.轉string ： + 字符串連接符
2.轉number： 自增自減 算術運算符 關係運算符（> < >= <= == != === !==）
3.轉boolean: ! 邏輯非
2.面試題的一些坑：重新認識比較運算符 x==y
a. 當x與y都爲null或者undefined, 返回true
b. 當x或y爲NaN,返回false
c. 當x或y都爲：string，number，boolean。且數據類型不一致的時候，此時會隱式轉換成number後比較
d. 如果x或y存在對象類型，則會轉爲原始值後比較
* 對象轉原始值 : 先調用valueOf()方法獲取原始值，然後調用toString()方法轉爲字符串
* valueOf() 默認返回自身
e. x與y都爲對象類型，則比較它們的引用地址。如果同一個地址則爲true，不同地址則爲false
*/
//1.===： 全等運算符
//嚴格匹配：值與數據類型必須要同時相等
console.log(undefined === null);//false
console.log("1" === 1);//false
console.log([] === {});//false
//2. x == y :相等運算符
//不嚴格匹配：當左右兩邊數據類型不一致的時候允許進行隱式數據類型轉換(有前提條件)
//例如
console.log(Number(null));//0
console.log(Number(undefined));//NaN
console.log(undefined == null);//true 此時沒有進行數據類型轉換
//2.1 當x與y都爲null或者undefined, 返回true
console.log(null == null);//true
console.log(undefined == undefined);//true
console.log(null == undefined);//true
//2.2 當x或y爲NaN,返回false
/* NaN與任何數字都不等 */
console.log(NaN == undefined);//false
console.log(NaN == null);//false
console.log(NaN == NaN);//false
//2.3 當x或y都爲：string，number，boolean。且數據類型不一致的時候，此時會隱式轉換成number後比較
console.log(1 == "1");//true 1 == Number('1')
console.log("0" == false);//true Number('0') == Number(false)
//2.4 如果x或y存在對象類型，則會轉爲原始值後比較
//對象轉原始值 : 先調用valueOf()方法獲取原始值，然後調用toString()方法轉爲字符串
console.log([1, 2, 3].valueOf());//[1, 2, 3] 默認情況下valueOf方法返回自身
console.log([1, 2, 3].valueOf().toString());// 1,2,3
console.log([1, 2, 3] == "1,2,3");//true
//關於空對象與空數組的原始值
console.log([].valueOf().toString());//'' 空字符串
console.log({}.valueOf().toString());//[object Object] 空字符串
console.log([] == "");//true
console.log({} == '[object Object]');//true
/*以下是常見的面試坑*/
console.log([] == 0);//true
/*分析過程
(1) [].valueOf ().toString () == ''
(2) '' == 0
*/
console.log(![] == 0);//true
/*分析過程：一元運算符優先級高於二元運算符
![] = false
false == 0
*/
console.log({} == 0);//false
/*分析過程
(1) {}.valueOf ().toString () == '[object Object]'
(2) '[object Object]' == 0
*/
console.log(!{} == 0);//true
/*分析過程：一元運算符優先級高於二元運算符
!{} = false
false == 0
*/
//2.5 x與y都爲對象類型，則比較它們的引用地址。如果同一個地址則爲true，不同地址則爲false
var arr1 = [1, 2, 3];
var arr2 = arr1;
console.log(arr2 == arr1);//true 地址一致
var arr3 = [1, 2, 3];
console.log(arr1 == arr3);//false 地址不一致
/*以下爲面試題的一些坑*/
console.log({} == {});//false 同時聲明兩個空對象，堆中地址不同
console.log([] == []);//false 同時聲明兩個空數組，堆中地址不同
console.log(null == 0);//false 相等比較 null不會轉number，代表的是堆中的一個空地址（可以理解爲堆地址的起點0x0000）
console.log(null >= 0);//true 大小比較 null會轉成number類型0
console.log(null <= 0);//true
</script>
</body>
</html>
JS基礎語法（07）-比較運算符隱式類型轉換
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章
初識jQuery基礎入門到放棄Day3——筆記整理+作業×1+經典例題×1
1.jQuery 尺寸操作 jQuery 尺寸操作包括元素寬高的獲取和設置，且不一樣的API對應不一樣的盒子模型 <body> <div></div> <script> $(function() {
JavaScript面向對象學習(part2)——筆記整理→香菇
文章目錄 一.構造函數和原型 1.對象的創建方式 1.2靜態成員和實例成員 1.2.1實例成員 1.2.2靜態成員 1.3構造函數的問題 1.4構造函數原型prototype