前言

在 JavaScript 中，在進(jìn)行運(yùn)算操作時(shí)，如果兩邊數(shù)據(jù)不統(tǒng)一，這時(shí)我們編譯器會(huì)自動(dòng)將運(yùn)算符兩邊的數(shù)據(jù)做一個(gè)數(shù)據(jù)類型轉(zhuǎn)換再進(jìn)行計(jì)算。這種由編譯器進(jìn)行自動(dòng)轉(zhuǎn)換的方式被稱為隱式轉(zhuǎn)換。

數(shù)學(xué)運(yùn)算符中的類型轉(zhuǎn)換

減、乘、除

在對(duì)非 Number 類型運(yùn)用數(shù)學(xué)運(yùn)算符(-、* 或 /)時(shí)，會(huì)先將非 Number 類型轉(zhuǎn)換為 Number 類型再進(jìn)行計(jì)算。示例如下:

2 - true  // 結(jié)果為 1，首先把 true 轉(zhuǎn)換為數(shù)字 1，然后執(zhí)行 2 - 1
2 - null  // 結(jié)果為 0，首先把 null 轉(zhuǎn)換為數(shù)字 0，然后執(zhí)行 2 - 0
2 - undefined  // 結(jié)果為 NaN，因?yàn)?undefined 被轉(zhuǎn)換為 NaN，然后執(zhí)行 2 - NaN
2 * '5'  // 結(jié)果為 10，'5' 首先會(huì)變成數(shù)字 5, 然后執(zhí)行 2 * 5

注意：在算術(shù)運(yùn)算中，如果操作數(shù)中有 undefined，其運(yùn)算結(jié)果是就是 NaN；null 在算術(shù)運(yùn)算中則是隱式轉(zhuǎn)換為數(shù)值 0 來(lái)參與運(yùn)算。

加

為什么加法要區(qū)別對(duì)待？因?yàn)?js 中 + 還可以用來(lái)拼接字符串。

加法運(yùn)算遵守以下 3 條規(guī)則，優(yōu)先級(jí)從高到低

當(dāng)一側(cè)為 String 類型，被識(shí)別為字符串拼接，并會(huì)優(yōu)先將另一側(cè)轉(zhuǎn)換為字符串類型。

當(dāng)一側(cè)為 Number 類型，另一側(cè)為原始類型，則將原始類型轉(zhuǎn)換為 Number 類型。

當(dāng)一側(cè)為 Number 類型，另一側(cè)為引用類型，將引用類型和 Number 類型轉(zhuǎn)換成字符串后拼接。

示例如下：

123 + '123'  // 246 (規(guī)則1)
123 + null  // 123 (規(guī)則2)
123 + true  // 124 (規(guī)則2)
123 + undefined  // NaN (規(guī)則2)
123 + {}  // 123[object Object] (規(guī)則3)

邏輯語(yǔ)句中的類型轉(zhuǎn)換

單個(gè)變量

如果只有單個(gè)變量，會(huì)先將變量轉(zhuǎn)換為 Boolean 值。只有 null、undefined、''、NaN、0、 false 這幾個(gè)會(huì)被轉(zhuǎn)換為 false，其他的情況都是 true，比如 {} , [] 等。示例如下：

if (null) {
  console.log('111')
} else {
  console.log('222')
}
// 輸出 222

使用 == 比較

使用 == 比較，比較規(guī)則如下：

NaN 和其他任何類型比較永遠(yuǎn)返回 false（包括和它自己）。

Boolean 和其他任何類型比較，Boolean 首先被轉(zhuǎn)換為 Number 類型。

String 和 Number 比較，先將 String 類型轉(zhuǎn)換為 Number 類型。

null == undefined 比較結(jié)果是 true，除此之外，null、undefined 和其他任何類型的比較都為 false。

原始類型 和 引用類型 比較時(shí)，引用類型會(huì)依照 ToPrimitive 規(guī)則轉(zhuǎn)換為原始類型。(ToPrimitive 在下面有解釋)

示例如下：

NaN == NaN  // false (規(guī)則1)

// (規(guī)則2)
true == 1  // true
true == '1'  // true
true == '2'  // false
true == ['1']  // true, 先把 true 變成 1， ['1'] 拆箱成 '1', 再參考(規(guī)則3)
true == ['2']  // false, 同上

// (規(guī)則3)
123 == '123'  // true
'' == 0  // true

// (規(guī)則4)
null == undefined  // true
null == ''  // false
null == 0  // false
null == false  // false
undefined == ''  // false
undefined == 0  // false
undefined == false  // false

// (規(guī)則5)
'[object Object]' == {}  // true, 字符串和對(duì)象比較，對(duì)象通過(guò) toString 得到一個(gè)基本類型值
'1,2,3' == [1,2,3]  // true, 同上，[1,2,3] 通過(guò) toString 得到一個(gè)基本類型值

ToPrimitive

ToPrimitive 規(guī)則會(huì)嘗試調(diào)用對(duì)象的 valueOf 和 toString 方法，將參數(shù)轉(zhuǎn)換為原始類型。

當(dāng)對(duì)象類型需要轉(zhuǎn)為原始類型時(shí)，它會(huì)先查找對(duì)象的 valueOf 方法，如果 valueOf 方法返回原始類型的值，則 ToPrimitive 的結(jié)果就是這個(gè)值，如果 valueOf 不存在或者 valueOf 方法返回的不是原始類型的值，就會(huì)嘗試調(diào)用對(duì)象的 toString 方法，也就是會(huì)遵循對(duì)象的 ToString 規(guī)則，然后使用toString 的返回值作為 ToPrimitive 的結(jié)果。

示例如下：

let str = new String(1)  // 通過(guò) new String 創(chuàng)建了一個(gè)對(duì)象
console.log(typeof str)  // object
console.log(str.valueOf())  // "1"
console.log(typeof str.valueOf())  // string

const obj = {
  valueOf() {
    return 1
  },
  toString() {
    return 2
  }
}
console.log(Number(obj))  // 1

注意：如果 valueOf 和 toString 都沒(méi)有返回原始類型的值，則會(huì)拋出異常。

示例如下：

const obj = {
  valueOf() {
    return []
  },
  toString() {
    return {}
  }
}
console.log(Number(obj))  // TypeError: Cannot convert object to primitive value

特殊：

String({})  // [object Object]
Number([])  // 0

String({}) 空對(duì)象會(huì)先調(diào)用 valueOf，但返回的是對(duì)象本身 {}，不是原始類型，所以會(huì)繼續(xù)調(diào)用toString，得到 [object Object]，String([object Object])，所以轉(zhuǎn)換后的結(jié)果為 [object Object]。

Number([]) 空數(shù)組會(huì)先調(diào)用 valueOf，但返回的是數(shù)組本身 []，不是原始類型，所以會(huì)繼續(xù)調(diào)用toString，得到 ''，相當(dāng)于 Number('')，所以轉(zhuǎn)換后的結(jié)果為 0。

以上就是JavaScript 隱式類型轉(zhuǎn)換規(guī)則詳解的詳細(xì)內(nèi)容，更多關(guān)于JavaScript 隱式類型轉(zhuǎn)換的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！