【關於Javascript】--- 隱式型別轉換篇

Jerry發表於2023-05-07

一、兩種資料型別:基本型別、引用型別

基本型別:

String、 Boolean、Number、Undefined、Null、Symbol、 BigInt

引用型別:

Array、Object、Function

二、基礎型別的轉換:

1、數字加字串,變字串

var num = 1 + '2'; //只要有string型別的,原始值轉化字串toString()操作,進行字串拼接

2、數字 減 乘 除 大於 小於 字串,字串轉數字

如果字串是純數字或空字串或16進位制則轉成數字,否則NaN

var num = 12 - '3'; //9 數字
var num = 12 / '3'; //4 數字
var num = 12 * '3'; //36 數字
var num = 12 - '3a'; //NaN 字串轉NaN 數字-NaN 等於NaN
var bo = 12 > '3'; //true 字串3轉數字 再比較
var bo = 12 > '3a'; //false 字串轉NaN 比較不成立錯誤

三、引用型別的轉換:

先把引用型別轉基礎型別再按照基礎型別的方式比較。

如果是Date型別的PreferredType被設定為String ,其餘PreferredType被設定為Number

1、PreferredType為Number 先valueOf()再toString()

1 輸入的值是原始值, 則直接返回原始值
2 否則呼叫物件的valueOf()方法,如果valueOf()方法的返回值是原始值,則返回這個原始值。
3 否則呼叫物件的toString()方法, 如果toString()方法的返回值是原始值,則返回這個原始值。
4 否則 丟擲TypeError異常

2、PreferredType為String 先toString()再valueOf()

1 輸入的值是原始值,則直接返回原始值
2 否則呼叫物件的toString()方法,如果toString()方法返回值是原始值,則返回這個原始值。
3 否則呼叫valueOf()方法,如果valueOf()方法的返回值是原始值,則返回這個原始值。
4 否則 丟擲TypeError異常 

部分例子:

console.log([] + []);  //'' (空字串)
//1 []以Number為轉換標準, valueOf() 得到的依然是[]
//2 [] toString 得到 ''
// '' + '' 得到 


console.log([] + {}); // '[object Object]'
//1 []以Number轉換標準, valueOf() > toString() 得到 ''
//2 {}以Number轉換標準,  valueOf()得到{} > toSting() 得到 '[object Object]'
//兩邊字串憑藉得到'[object Object]’


console.log({} + {}); //'[object Object][object Object]'
//1 {}以Number轉換標準,  valueOf()得到{} > toSting() 得到 '[object Object]’
//兩邊字串憑藉得到'[object Object][object Object]’


var a = 'hello ', b = {};
console.log( a + b ); // ‘hello [object Object]’
//1 a是原始型別 直接返回
//2 {}以Number轉換標準,  valueOf()得到{} > toSting() 得到 '[object Object]’
//3 'hello ' + '[object Object]'

四、有關==的隱式轉換

規則 1:NaN和其他任何型別比較都是false(包括和他自己)

NaN == NaN // false

規則 2:Boolean和其他任何型別比較,Boolean首先轉成Number

true == 1  // true 
true == '2'  // false, 先把 true 變成 1 再比較
true == ['1']  // true, 先把 true 變成 1, ['1']拆箱成 '1', 
undefined == false // false ,首先 false 變成 0,然後參考規則4
null == false // false,同上

規則 3:String和Number比較,String轉成Number型別

123 == '123' // true, '123' 會先變成 123
'' == 0 // true, '' 會首先變成 0
‘0’ == false // true 兩者轉數字

規則 4:null == undefined是true,除此之外,null、undefined和其他任何結果比較都為false

null == undefined // true

null == '' // false
null == 0 // false
null == false // false
undefined == '' // false
undefined == 0 // false
undefined == false // false

規則 5:原始型別和引用型別做比較時,引用型別會依照ToPrimitive規則轉換為原始型別再比較

'[object Object]' == {} 
// true, 物件和字串比較,物件透過 toString 得到一個基本型別值
'1,2,3' == [1, 2, 3] 
// true, 同上  [1, 2, 3]透過 toString 得到一個基本型別值

五、圖示型別值轉換

image.png
image.png
image.png

資料:

JavaScript隱式轉換
JavaScript 隱式型別轉換,一篇就夠了
幫你徹底弄懂 JavaScript 型別轉換

相關文章