目錄
- 前言
- 一、強制轉換
- 1、其他的資料型別轉換為String
- 方式一：toString()方法
- 方式二：String()函式
- 2、其他的資料型別轉換為Number
- 方式一：使用Number()函式
- 方式二：parseInt() & parseFloat()
- 3、其他的資料型別轉換為Boolean
- 1、其他的資料型別轉換為String
- 二、自動轉換
- 1.自動轉換為布林值
- 2.自動轉換為數值
- 3.自動轉換為字串
- 三、總結
- 1. 強制轉換的各種情況
- 2. 自動轉換的的各種情況
- 后記
前言
JavaScript是一門動態語言，所謂的動態語言可以暫時理解為在語言中的一切內容都是不確定的，比如一個變數，這一時刻是個整型，下一時刻可能會變成字串了，雖然變數的資料型別是不確定的，但是各種運算子對資料型別是有要求的，如果運算子發現，運算子的型別與預期不符，就會自動轉換型別，
本文主要介紹資料型別強制轉換和自動轉換，自動轉換是基于強制轉換之上，強制轉換主要指使用Number、String和Boolean三個函式，手動將各種型別的值，分布轉換成數字、字串或者布林值，
一、強制轉換
1、其他的資料型別轉換為String
方式一：toString()方法
- 呼叫被轉換資料型別的toString()方法,該方法不會影響到原變數，它會將轉換的結果回傳，但是注意：null和undefined這兩個值沒有toString，如果呼叫他們的方法，會報錯，
var a = 123
a.toString()//"123"
var b = null;
b.toString()//"報錯"
var c = undefined
c.toString()//"報錯"
- 采用 Number 型別的 toString() 方法的基模式，可以用不同的基輸出數字，例如二進制的基是 2，八進制的基是 8，十六進制的基是 16
var iNum = 10;
alert(iNum.toString(2)); //輸出 "1010"
alert(iNum.toString(8)); //輸出 "12"
alert(iNum.toString(16)); //輸出 "A"
方式二：String()函式
- 使用String()函式做強制型別轉換時，對于Number和Boolean實際上就是呼叫的toString()方法,
但是對于null和undefined，就不會呼叫toString()方法,它會將null直接轉換為"null",將undefined 直接轉換為"undefined"
var a = null
String(a)//"null"
var b = undefined
String(b)//"undefined"
- String方法的引數如果是物件，回傳一個型別字串；如果是陣列，回傳該陣列的字串形式，
String({a: 1}) // "[object Object]"
String([1, 2, 3]) // "1,2,3"
2、其他的資料型別轉換為Number
方式一：使用Number()函式
下面分成兩種情況討論，一種是引數是原始型別的值，另一種是引數是物件
(1)原始型別值
①字串轉數字
Ⅰ 如果是純數字的字串，則直接將其轉換為數字
Ⅱ 如果字串中有非數字的內容，則轉換為NaN
Ⅲ 如果字串是一個空串或者是一個全是空格的字串，則轉換為0
Number('324') // 324
Number('324abc') // NaN
Number('') // 0
②布林值轉數字:true轉成1,false轉成0
Number(true) // 1
Number(false) // 0
③undefined轉數字:轉成NaN
Number(undefined) // NaN
④null轉數字：轉成0
Number(null) // 0
⑤Number() 接受數值作為引數，此時它既能識別負的十六進制，也能識別0開頭的八進制，回傳值永遠是十進制值
Number(3.15); //3.15
Number(023); //19
Number(0x12); //18
Number(-0x12); //-18
(2)物件
簡單的規則是，Number方法的引數是物件時，將回傳NaN，除非是包含單個數值的陣列，
Number({a: 1}) // NaN
Number([1, 2, 3]) // NaN
Number([5]) // 5
方式二：parseInt() & parseFloat()
這種方式專門用來對付字串，parseInt()一個字串轉換為一個整數,可以將一個字串中的有效的整數內容取出來，然后轉換為Number，parseFloat()把一個字串轉換為一個浮點數，parseFloat()作用和parseInt()類似，不同的是它可以獲得有效的小數，
console.log(parseInt('.21')); //NaN
console.log(parseInt("10.3")); //10
console.log(parseFloat('.21')); //0.21
console.log(parseFloat('.d1')); //NaN
console.log(parseFloat("10.11.33")); //10.11
console.log(parseFloat("4.3years")); //4.3
console.log(parseFloat("He40.3")); //NaN
parseInt()在沒有第二個引數時默認以十進制轉換數值，有第二個引數時，以第二個引數為基數轉換數值，如果基數有誤回傳NaN
console.log(parseInt("13")); //13
console.log(parseInt("11",2)); //3
console.log(parseInt("17",8)); //15
console.log(parseInt("1f",16)); //31
兩者的區別：Number函式將字串轉為數值，要比parseInt函式嚴格很多，基本上，只要有一個字符無法轉成數值，整個字串就會被轉為NaN，
parseInt('42 cats') // 42
Number('42 cats') // NaN
上面代碼中，parseInt逐個決議字符，而Number函式整體轉換字串的型別，
另外，對空字串的處理也不一樣
Number(" "); //0
parseInt(" "); //NaN
3、其他的資料型別轉換為Boolean
它的轉換規則相對簡單：只有空字串("")、null、undefined、+0、-0 和 NaN 轉為布爾型是 false，其他的都是 true，空陣列、空物件轉換為布爾型別也是 true,甚至連false對應的布爾物件new Boolean(false)也是true
Boolean(undefined) // false
Boolean(null) // false
Boolean(0) // false
Boolean(NaN) // false
Boolean('') // false
Boolean({}) // true
Boolean([]) // true
Boolean(new Boolean(false)) // true
二、自動轉換
遇到以下三種情況時，JavaScript 會自動轉換資料型別，即轉換是自動完成的，用戶不可見，
1.自動轉換為布林值
JavaScript 遇到預期為布林值的地方(比如if陳述句的條件部分),就會將非布林值的引數自動轉換為布林值，系統內部會自動呼叫Boolean函式，
if ('abc') {
console.log('hello')
} // "hello"
2.自動轉換為數值
算數運算子(+ - * /)跟非Number型別的值進行運算時，會將這些值轉換為Number，然后在運算，除了字串的加法運算
true + 1 // 2
2 + null // 2
undefined + 1 // NaN
2 + NaN // NaN 任何值和NaN做運算都得NaN
'5' - '2' // 3
'5' * '2' // 10
true - 1 // 0
'1' - 1 // 0
'5' * [] // 0
false / '5' // 0
'abc' - 1 // NaN
一元運算子也會把運算子轉成數值，
+'abc' // NaN
-'abc' // NaN
+true // 1
-false // 0
3.自動轉換為字串
字串的自動轉換，主要發生在字串的加法運算時，當一個值為字串，另一個值為非字串，則后者轉為字串，
'5' + 1 // '51'
'5' + true // "5true"
'5' + false // "5false"
'5' + {} // "5[object Object]"
'5' + [] // "5"
'5' + function (){} // "5function (){}"
'5' + undefined // "5undefined"
'5' + null // "5null"
三、總結
1. 強制轉換的各種情況
2. 自動轉換的的各種情況
- 只有空字串("")、null、undefined、+0、-0 和 NaN 轉為布爾型是 false，其他的都是 true
- 除了加法運算子（+）有可能把運算子轉為字串，其他運算子都會把運算子自動轉成數值，一元運算子也會把運算子轉成數值，
- 字串的自動轉換，主要發生在字串的加法運算時，
后記
如需前端指導或前端資料請聯系本人，感謝您的支持，
WECHAT：xzsj07
了解詳情
備注：請注明來源，
作者：浪里行舟
鏈接：JavaScript資料型別轉換
來源：github
著作權歸作者所有，商業轉載請聯系作者獲得授權，非商業轉載請注明出處，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/254381.html
標籤：其他
上一篇：JS中attr和prop區別