JS中數據類型轉換

1、JS中的數據類型

【六種基本數據類型】

• 數字 number
• 字符串string
• 布爾 boolean
• 空 null
• 未定義undefined
• 惟一的值 sysbol

【兩大類引用數據類型】

對象 object

• 普通對象
• 數組對象 (Array)
• 正則對象 (RegExp)
• 日期對象 (Date)
• 數學函數 (Math) ...

函數 function

真實項目中，根據需求，咱們每每須要把數據類型之間進行轉換：

2、 把其它數據類型轉換爲number類型

1.發生的狀況

• isNaN檢測的時候：當檢測的值不是數字類型,瀏覽器會本身調用Number方法把它先轉換爲數字，而後再檢測是否爲非有效數字

isNaN('3') =>false
  Number('3')->3
  isNaN(3)->false

isNaN('3px') =>true
  Number('3px')->NaN
  isNaN(NaN)->true
複製代碼

• 基於parseInt/parseFloat/Number去手動轉換爲數字類型
• 數學運算：+ - * / %，可是「+」不單單是數學運算，還多是字符串拼接

'3'-1 =>2
  Number('3')->3
  3-1->2

'3px'-1 =>NaN

'3px'+1 =>'3px1' 字符串拼接
複製代碼

var i='3';
i=i+1; =>'31'
i+=1; =>'31'
i++; =>4  i++就是單純的數學運算，已經摒棄掉字符串拼接的規則
複製代碼

• 在基於「==」比較的時候，有時候也會把其它值轉換爲數字類型
• ...

2.轉換規律

//=>轉換的方法：Number（瀏覽器自行轉換都是基於這個方法完成的）

【把字符串轉換爲數字】
只要遇到一個非有效數字字符，結果就是NaN
'' ->0
' ' ->0 空格(Space)
'\n' ->0 換行符(Enter)
'\t' ->0 製表符(Tab)


【把布爾轉換爲數字】
true ->1
false ->0

【把沒有轉換爲數字】
null ->0
undefined ->NaN

【把引用類型值轉換爲數字】
首先都先轉換爲字符串（toString），而後再轉換爲數字（Number）
複製代碼

3、把其它類型值轉換爲字符串

1.發生的狀況

• 基於alert/confirm/prompt/document.write等方法輸出內容的時候，會把輸出的值轉換爲字符串，而後再輸出

alert(1) =>'1'
複製代碼

• 基於「+」進行字符串拼接的時候
• 把引用類型值轉換爲數字的時候，首先會轉換爲字符串，而後再轉換爲數字
• 給對象設置屬性名，若是不是字符串，首先轉換爲字符串，而後再當作屬性存儲到對象中（對象的屬性只能是數字或者字符串）
• 手動調用toString/toFixed/join/String等方法的時候，也是爲了轉換爲字符串

var n=Math.PI;//=>獲取圓周率：
n.toFixed(2) =>'3.14'

var ary=[12,23,34];
ary.join('+') =>'12+23+34'
複製代碼

• ...

2.轉換規律

//=>調用的方法：toString

【除了對象，都是你理解的轉換結果】
1 ->'1'
NaN ->'NaN'
null ->'null'
[] ->''
[13] ->'13'
[12,23] ->'12,23'
...

【對象】
{name:'xxx'} ->'[object Object]'
{} ->'[object Object]'
無論是啥樣的普通對象，最後結果都同樣
複製代碼

4、把其它值轉換爲布爾類型

1.發生的狀況

• 基於!/!!/Boolean等方法轉換
• 條件判斷中的條件最後都會轉換爲布爾類型
• ...

if(n){
  //=>把n的值轉換爲布爾驗證條件真假
}

if('3px'+3){
  //=>先計算表達式的結果'3px3'，把結果轉換爲布爾true，條件成立
}
複製代碼

2.轉換的規律 只有「0/NaN/' '/null/undefined」五個值轉換爲布爾的false,其他都是轉換爲true

5、特殊狀況：數學運算和字符串拼接 「+」

//=>當表達式中出現字符串，就是字符串拼接，不然就是數學運算

1+true =>2 數學運算
'1'+true =>'1true' 字符串拼接

[12]+10 =>'1210' 雖然如今沒看見字符串，可是引用類型轉換爲數字，首先會轉換爲字符串，因此變爲了字符串拼接
({})+10 =>"[object Object]10"
[]+10 =>"10"

{}+10 =>10 這個和以上說的沒有半毛錢關係，由於它根本就不是數學運算，也不是字符串拼接，它是兩部分代碼
  {} 表明一個代碼塊（塊級做用域）
  +10 纔是咱們的操做
  嚴格寫法：{}; +10;
複製代碼

題目：

12+true+false+null+undefined+[]+'你好'+null+undefined+[]+true =>'NaN你好nullundefinedtrue'
複製代碼

12+true ->13
13+false ->13
13+null ->13
13+undefined ->NaN
NaN+[] ->'NaN'
'NaN'+'珠峯' ->'NaN珠峯'
...
'NaN珠峯trueundefined'
'NaN珠峯trueundefined'+[] ->'NaN珠峯trueundefined'
...
=>'NaN珠峯trueundefinedtrue'
複製代碼

6、特殊狀況：「==」在進行比較的時候，若是左右兩邊的數據類型不同，則先轉換爲相同的類型，再進行比較

對象==對象：不必定相等，由於對象操做的是引用地址，地址不相同則不相等

{name:'xxx'}=={name:'xxx'} =>false
[]==[] =>false

var obj1={};
var obj2=obj1;
obj1==obj2 =>true
複製代碼

不一樣狀況的比較，都是把其它值轉換爲數字，而後再進行比較的:

對象==數字：把對象轉換爲數字
對象==布爾：把對象轉換爲數字，把布爾也轉換爲數字
對象==字符串：把對象轉換爲字符串，把字符串也轉換爲數字
字符串==數字：字符串轉換爲數字
字符串==布爾：都轉換爲數字
布爾==數字：把布爾轉換爲數字
複製代碼

重點記憶：

null==undefined：true
null===undefined：false
null&&undefined和其它值都不相等

NaN==NaN：false
NaN和誰都不相等包括本身
複製代碼

小例子：

1==true =>true
1==false =>false
2==true =>false  規律不要混淆，這裏是把true變爲數字1


[]==true：false  都轉換爲數字 0==1
![]==true：false

[]==false：true  都轉換爲數字 0==0
![]==false：true  先算![]，把數組轉換爲布爾取反=>false =>false==false
複製代碼