JS 裡的資料類型轉換

本文章為知乎搬運，非原創，原文連結位址：https://zhuanlan.zhihu.com/p/73190204

目錄：

1.了解一些詞語

2.資料的類型

3.類型之間的轉換

1.了解一些詞語

首先！

你現在處在某個空間，四周一片空白啥也沒有，你特别餓，很想吃東西。突然眼前出現一行字：【需要什麼東西你就 var 一下】

雖然這行提示說的并不詳細，但機智的你立馬就知道怎麼用了。

(英語瞎組合的，兩輛車的肉)

var food = 2 + ‘cars of meat’;

這裡有幾個詞：

【值】(value)：比如數字1就是一個值，數字被稱為數值（number），數值1和數值2加起來是數值3。但是如果把數字1用引号包圍起來，比如這樣 ‘1’，他就從數值1變成了字元串(string)‘1’，字元串‘1’和字元串’2’相加時和數值之間的相加不一樣，這兩個字元串相加會變成’12’，因為他們不是數字，他們相當是兩個隻讀的文字，隻能把他們的内容連接配接起來。

【變量】(variable)：上面綠色框中的food就是一個變量，從變量中的變字可以看出來，他是可變的，哪裡可變？你可以把food當成一個桶，你可以往這個桶裡裝東西，你第一次往裡面裝了兩車肉，你過了一秒覺得不好，太浪費了，把兩車肉從桶裡拿出來，裝了一盒冰淇淋進去。裡面裝的東西可變就是變量，和變量相反的是常量，如果你用常量裝這兩車肉，那就算肉馊了也隻能放桶裡捂着。（food是這個變量的變量名，你還可以給這個變量取其他你喜歡的名字。）

【指派運算符】(Assignment Operators)：它的作用是把[值]賦給[變量]，就是把那兩車肉放到桶裡的作用。

【語句】(statement)：JavaScript執行代碼時是按照順序一行一行往下執行（忽略變量提升函數提升等情況），一行代碼就是一個語句。【語句】的作用是為了完成某種任務的操作，比如上面那行語句，它的任務就是把橙色框内的内容指派給前面綠色框裡的food變量。

【表達式】（expression）：上面那行代碼中橙色框内的内容就是表達式，他的作用是為了傳回一個值，比如1+1傳回2這個值，而像語句就不用傳回一個值，語句是為了執行某個操作，比如把表達式傳回的2這個值指派給某個變量。

【var】：var 主要用來聲明一個變量，比如你所在的那個空間沒有一個叫food的桶，但是你想要一個叫food的桶，于是在第一次建立這個桶的時候，需要用var來建立它，後面如果你需要更改這個food裡的值的話，就不用了var了，因為我們隻有在建立變量的時候才用它。

2. 資料的類型

這裡資料的類型指的就是【值】(value)的類型。JavaScript在聲明變量的時候，用var聲明的變量，值可以是任 意 類 型，字元串，布爾值，數值，對象，數組等等都可以。

而在其他程式設計語言中，你想聲明一個變量，可能需要根據【值】的類型的不同，用不同的方式去聲明，比如值是整數，就用int，如果是浮點數，就用float。是以JavaScript在這點來說還是比較友善的。

在JavaScript中，值一共有幾種類型？

答案：7種

數值 number（如【值】為整數1，小數1.3，科學計數法12e2等表現形式） 字元串 string（如’hi’） null

undefined symbol （ES6新增内容，等我了解了再補） 對象 object 對象又可以分為三個子類型：

• 狹義的對象 object
• 數組 array
• 函數 function

布爾值 boolean （布爾值分為true和false）

數值：

值就是平時用的數字，可以用來加減乘除，比如上面的變量minus右邊的表達式用的是3-1這個計算式，計算結果是2，傳回的數值2指派給變量minus，輸入minus，果然傳回的值就是數值2.

字元串：

當你需要給變量指派一個字元串的時候，就需要把值用雙引号包圍起來，雙引号，單引号都可以。

變量a的值是一個數值，變量b的值是一個字元串，一個數值和一個字元串相加的結果是數值會被自動轉換成字元串，最終将兩個字元串的内容連接配接起來。

【加減乘除】四則運算中，當一個數值和一個字元串進行運算時，除了加号會把數值自動轉換成字元串，其他的乘法，除法，減法，都會把字元串自動轉化成數值。

【空字元串】和【空格字元串】：

空字元串是引号裡面什麼都沒有

空格字元串是引号裡面有一個空格

（length用來傳回該變量的長度，比如一個變量的值是’hi’，這個字元串就倆字元，h 和i，是以它的length是2。

a.length傳回的值是0，代表變量a裡面的字元串長度是0，啥也沒有；

b.length傳回的值是1，是因為b是一個空格字元串，裡面有一個空格，空格也能被浏覽器發現的！是以空字元串和空格字元串是有差別的）

null 和 undefined：

null 和 undefined 都可以表示‘沒有’，含義雖然非常相似，但實際還是有些差別。

像在其他程式設計語言中，隻有null或者隻有undefined，為什麼在JavaScript中既有null又有undefined呢！真的很令人頭大啊！

其實JavaScript最開始和java一樣，也是隻有null的。null有一個特點，會自動變成0和數字進行運算

當時已經有了null，為了想明白為什麼JavaScript的設計者還要額外設定一個undefined，我們可以先用typeof這個專門用來檢測值是什麼類型的函數看一下null本身是什麼類型（正常來說，數字1的類型是number，'1’的類型是字元串，null的類型應該也是null吧！）。

調用typeof函數，把null這個值放進括号裡，傳回的結果告訴了我們剛剛傳入的值是什麼類型。

null的類型居然不是null，而是對象（object）！最開始的時候，JavaScript設計者Brendan Eich最初并沒有把null設為一個單獨的類型，null是被歸類為對象這個類型中的，他認為，表示‘無’的這個值最好不要是對象，是以作為對象的null被他無視掉了，于是就有了undefined這個東西。

用法：

null:

表示【空值】，就是說，這個地方的值為空。比如調用函數的時候，如果某個參數沒有設定任何值，這個時候就可以傳入【null】，表示這個參數為空。

或者如某個函數接受引擎傳入的錯誤作為參數，如果運作的時候沒有發生任何錯誤，那麼這個參數就會傳入【null】，表示沒有發生錯誤。

undefined：

表示‘未定義’的原始值，當我們聲明了一個變量後，可以先不用指派給變量，這時候未指派的變量他此刻的值就是undefined

布爾值：

隻有【true】 【false】 兩個值

true是真，false是假。true和false經常用于if語句，比如：

第一步藍色框：聲明一個變量，變量名是【我機智嗎】，值為【機智】

第二步橙色框：用if語句做判斷，兩個等于号是相等運算符，判斷兩邊值是否相等，結果會傳回布爾值true 或者 false。如果這個變量的值是【機智】，傳回的就是true，代表是真的，是對的，就會執行花括号裡面的代碼（中間console.log的作用是向控制台輸出括号裡的内容），如果不是，就不執行

第三步綠色框：執行了花括号裡的語句，代表那句判斷為true！

下列運算符會傳回布爾值：

• 兩元邏輯運算符： && ||
• 前置邏輯運算符： ！（Not）
• 相等運算符： === !== == !=
• 比較運算符： > >= < <=

以下六個值預設會被轉為false，其他為true：

• undefined
• null
• false
• NaN
• " " 或 ’ ’ （空字元串）

例:

if 指令後面是一個布爾值，JavaScript自動将NaN轉為布爾值false，導緻程式不會進入代碼塊，也就是不會執行代碼裡的指令了，是以不會有任何輸出。

NaN：not a number，意思是【不是數字】。7種資料類型中有null和undefined,null在和數值進行運算的時候會自動變成0進行運算，但是undefined和數字進行運算的時候會轉換成NaN，導緻最終傳回值就是NaN，傳回的不是一個數字，但是NaN卻是屬于number這一類，雖然它本身的意思是【不是數字】。

對象：

這個感覺要寫好多= = 下次如果寫關于函數，構造函數，對象之間關系的筆記的話再寫吧。

（簡單點）

對象是一組【鍵值對】（key-value）的集合，是一種無序的複合資料集合。

大括号定義了一個對象，指派給object，這個變量object就指向一個對象，對象内部包含兩個鍵值對，字元串 aa 是【鍵值】。鍵名和鍵值之間用冒号分隔，兩個鍵值之間用逗号分隔（最後一個屬性的逗号可加可不加）。

鍵名

對象的所有鍵名都是【字元串】，是以加不加引号都可以，上面沒加引号的鍵名也可以這樣寫

但是用雙引号的好處是，鍵名你可以想怎麼取就怎麼取，因為JavaScript實際上取名字有時候會有限制的，不能為所欲為，比如你的鍵名不用引号，想取一個全部都是數字的鍵名是不允許的，開頭用數字會報錯，但是你加上引号的話，鍵名開頭用數字就沒問題。加雙引号是更标準的，功能更強大，不加雙引号就是取名稍有限制，但是更為偷懶的方法。

數值，字元串，null，undefined，symbol，布爾值，對象這七個類型，我們按照他們的特性讓他們分成兩個組合吧。

【基本類型】：數值，字元串，null，undefined，symbol，布爾值

【複合類型】：對象 （之是以對象是複合類型，是因為一個對象往往由多個基本類型的值組合在一起的）

3.類型之間的轉換

資料類型的轉換分為【強制轉換】 和 【自動轉換】

強制轉換：

自己用一些函數等方法把任意值轉換成另一個類型的資料。（比如用 函數String() 把數值 1 轉換成字元串 ‘1’ ）

一般轉換類型會轉成下面三種：

1.數值

2.字元串

3.布爾值

1 數值

可以使用 Number（）函數

作用： 将任意類型的值轉為數值

下面分兩種情況，一種參數為【基本類型】，一種為【對象】

（參數：在聲明/調用也就是使用函數的時候，括号裡的值就叫參數，隻不過聲明的時候，函數裡的參數叫形參，調用的時候，參數叫實參）

（1）基本類型

其他方法：

1. 【轉整數】parseInt（）

文法: parseInt(string, radix) （字元串,基數(2~36))

第二個參數意思是需要轉成幾進制，比如下面例子中的 10 是轉成 10進制

如果parseInt的參數不是字元串，則會先轉為字元串再轉換。這個很重要

parseInt(10) // 10
           

1. 【轉浮點數】parseFloat() （不用寫第二個參數是幾進制，因為隻能轉成10進制）
2. 【浮點數 + 整數】 - 0

• 0 有效是因為隻有加法運算符遇到字元串會自動轉換成字元串，其他減法，乘法，除法都會把字元串變成數字

1. 【浮點數 + 整數】 + （數值運算符，和Number作用一樣）

Number() 和parseInt() 函數差別：

Number更加嚴格，隻要一個值無法轉成數值，整個字元串就會轉為【NaN】，告訴我們這不能轉為數值。

Number轉成浮點數/整數都可以，parseInt隻能整數

（2）對象

Number() 參數是對象時，傳回【NaN】，除非時包含單個數值的數組

2 字元串

可以使用String（）函數

作用： 将任意值轉為字元串

下面（1）寫基本類型轉換規則，（2）寫對象轉換規則

（1）基本類型

• 數值： 轉為相應的字元串
• 字元串： 還是原來的值
• 布爾值： true轉為‘true’， false轉為‘false’
• undefined： 轉為’undefined’
• null ： 轉為’null’

其他方法：

加号 + 和 空字元串 ‘’/ “”

（2）對象

參數為對象時，傳回值是以字元串的形式顯示該參數的類型；

參數為數組時，傳回該數組的字元串形式

>String(['a','cd'])
<"a,cd"
>String({'a':1,'b':2})
<"[object Object]"
           

3 布爾值

可用函數 Boolean()

作用： 将任意類型轉為布爾值

除了以下五個值的轉換結果是false，其他值全為true

• undefined
• null
• -0 / +0
• NaN
• ‘’ （空字元串）
• false

【背誦方法： 除了symbol和對象外的其他資料類型，共5個資料類型，每個資料類型至少有一個值是false。

number類型有兩個值是false，分别是0 和 NaN；

string類型的空字元串’'是false；

null,undefined這兩個本身是false；

布爾值中的false肯定是false】

【或者更友善的方法是用兩個感歎号】

一個感歎号作用是以布爾值的方式取自己的相反值，兩個感歎号就是相反值的相反值，也就是以本身布爾值的方式表示出來

自動轉換

下面三種情況JavaScript會自動轉換資料類型

① 不同類型的資料互相運算 （加法運算符）

② 對非布爾值類型的資料求布爾值

③ 對非數值類型的值使用一進制運算符（+ 和 -）