前言：之前的博客你真的了解JS的數(shù)據(jù)類型囱持？介紹了JS中的各種數(shù)據(jù)類型冬耿，那么可不可以把其他的數(shù)據(jù)類型轉(zhuǎn)換成特定的一種數(shù)據(jù)類型呢坤塞？本文就將介紹一些方法達(dá)成此目的冯勉，另外還會簡單引申JS中的內(nèi)存圖、關(guān)于的內(nèi)存的相關(guān)題目摹芙、深拷貝與淺拷貝等相關(guān)知識灼狰。

如何將其他的數(shù)據(jù)類型轉(zhuǎn)換成String字符串類型？

注：下面介紹的三種轉(zhuǎn)換成字符串的方法都不適用于對象object（腰間盤真突出）浮禾，所得結(jié)果都是"[object Object]",但是對于函數(shù)和數(shù)組是可以轉(zhuǎn)換的

• ?.toString()
• String(?)
• ''+ ?
  上面的問號交胚？代表是其他數(shù)據(jù)類型，這樣可以快速得知使用方法

方法1：?.toString()（小白做法）

toString方法適用于number類型和boolean類型盈电，但是將數(shù)字轉(zhuǎn)換為字符串時蝴簇，要特別注意，如

//將數(shù)字轉(zhuǎn)換為字符串錯誤寫法
1.toString() //Uncaught SyntaxError: Invalid or unexpected token
//正確寫法
(1).toString() //"1"
true.toString() //"true"

但是對于null和undefined匆帚，使用這種方法會報錯熬词，如：
報錯信息揭秘：
不能讀null的toString方法，null沒有toString的api，所以報錯互拾，undefined類似

null.toString() //Uncaught TypeError: Cannot read property 'toString' of null
undefined.toString() //Uncaught TypeError: Cannot read property 'toString' of undefined

對于object歪今，toSring方法結(jié)果不正確，結(jié)果永遠(yuǎn)是"[object Object]"颜矿，函數(shù)和數(shù)組是比較特別,具體請看代碼

//錯誤寫法
{}.toString() //Uncaught SyntaxError: Unexpected token .
//正確寫法
({}).toString() //"[object Object]"
var obj = {}
obj.toString() //結(jié)果為 "[object Object]"

//函數(shù)
//錯誤寫法
function(){}.toString() //Uncaught SyntaxError: Unexpected token (
//正確寫法
(function(){}).toString()  //"function(){}"

//數(shù)組
[].toString()  //"" 
[1,2,3].toString() //"1,2,3"

方法2：String(?)（小白做法）

String() 該方法適用于所有數(shù)據(jù)類型（除了對象寄猩，結(jié)果同toString()）

String(123)  //"123"
String(true) //"true"
String(null) //"null"
String(undefined) //"undefined"
String({name:'frank'}) //"[object Object]"
String([1,2,3])  //"1,2,3"
String(function(){}) //"function(){}"

方法3：''+ ?（老司機做法）

注：這種方法的原理是：‘+’ 運算符只能相加相同的數(shù)據(jù)類型，如果兩邊的數(shù)據(jù)類型不同骑疆，他會優(yōu)先將其轉(zhuǎn)換成字符串來相加田篇。
''+ ? 即使用+運算符加上空字符串（同樣對object無效）該方法適用于所有數(shù)據(jù)類型（除了對象，結(jié)果同toString()）

1 + ''   //"1"
false + ''  //"false"
null + ''  //"null"
undefined + ''  //"undefined"
[1,2,3] + ''  //"1,2,3"

var obj = {name : 'frank'}
obj + ''  //"[object Object]"

function(){} + '' //Uncaught SyntaxError: Unexpected token (
(function(){}) + ''  //"function(){}"

[1,2,3] + ''  //"1,2,3"

踩坑時間到
小谷問：1+'1'的結(jié)果是多少箍铭？
小白說：你這是看不起我嗎斯辰？2啊
小谷說：你踩坑啦，當(dāng)然不是坡疼，具體，我一一給你道來

1+'1'  //"11"
//上面的做法衣陶，相當(dāng)于是下面這個步驟柄瑰，根據(jù)上面的那個原理得出
(1).toString() + '1'  //"11"

小Tips：

• 三種轉(zhuǎn)換成字符串的方法對于對象來說，是特殊的
• 使用這種方法?.toString()報錯剪况，只需給需要轉(zhuǎn)換的東西加上個括號教沾，具體例子請看上面

如何將其他的數(shù)據(jù)類型轉(zhuǎn)換成Number數(shù)值類型？

注：parseInt逐個解析字符译断，而Number函數(shù)整體轉(zhuǎn)換字符串的類型授翻。parseInt,parseFloat和Number函數(shù)都會自動過濾一個字符串前導(dǎo)和后綴的空格。parseInt(?,?)說明parseInt可以有兩個參數(shù)

• Number(?)
• parseInt(?,?)
• parseFloat(?)
• '?' - 0
• + '?'

方法1：Number(?)

使用Number函數(shù)孙咪，可以將任意類型的值轉(zhuǎn)化成數(shù)值堪唐。Number函數(shù)將字符串轉(zhuǎn)為數(shù)值，要比parseInt函數(shù)嚴(yán)格很多翎蹈。基本上淮菠，只要有一個字符無法轉(zhuǎn)成數(shù)值，整個字符串就會被轉(zhuǎn)為NaN荤堪。
下面分成兩種情況討論合陵，一種是參數(shù)是原始類型的值，另一種是參數(shù)是對象澄阳。
（1）原始類型值
示例如下：

// 數(shù)值：轉(zhuǎn)換后還是原來的值
Number(324) // 324

// 字符串：如果可以被解析為數(shù)值拥知，則轉(zhuǎn)換為相應(yīng)的數(shù)值
Number('324') // 324

// 字符串：如果不可以被解析為數(shù)值，返回 NaN
Number('324abc') // NaN

// 空字符串轉(zhuǎn)為0
Number('') // 0

// 布爾值：true 轉(zhuǎn)成 1碎赢，false 轉(zhuǎn)成 0
Number(true) // 1
Number(false) // 0

// undefined：轉(zhuǎn)成 NaN
Number(undefined) // NaN

// null：轉(zhuǎn)成0
Number(null) // 0

Number('42 cats') // NaN

（2）對象
Number方法的參數(shù)是對象時低剔，將返回NaN，除非是包含單個數(shù)值的數(shù)組揩抡。
示例如下：

Number({a: 1}) // NaN
Number([1, 2, 3]) // NaN
Number([5]) // 5

Number背后的轉(zhuǎn)換規(guī)則比較復(fù)雜户侥。
第一步镀琉，調(diào)用對象自身的valueOf方法。如果返回原始類型的值蕊唐，則直接對該值使用Number函數(shù)屋摔，不再進(jìn)行后續(xù)步驟。
第二步替梨，如果valueOf方法返回的還是對象钓试，則改為調(diào)用對象自身的toString方法。如果toString方法返回原始類型的值副瀑，則對該值使用Number函數(shù)弓熏，不再進(jìn)行后續(xù)步驟。
第三步糠睡，如果toString方法返回的是對象挽鞠，就報錯。

方法2：parseInt()

parseInt方法用于將字符串轉(zhuǎn)為整數(shù)狈孔。
如：parseInt('123') // 123
如果字符串頭部有空格信认，空格會被自動去除。parseInt(' 81') // 81
如果parseInt的參數(shù)不是字符串均抽，則會先轉(zhuǎn)為字符串再轉(zhuǎn)換嫁赏。

parseInt(1.23) // 1
// 等同于
parseInt('1.23') // 1

字符串轉(zhuǎn)為整數(shù)的時候，是一個個字符依次轉(zhuǎn)換油挥，如果遇到不能轉(zhuǎn)為數(shù)字的字符潦蝇，就不再進(jìn)行下去，返回已經(jīng)轉(zhuǎn)好的部分深寥。

parseInt('8a') // 8
parseInt('15e2') // 15
parseInt('15px') // 15

如果字符串的第一個字符不能轉(zhuǎn)化為數(shù)字（后面跟著數(shù)字的正負(fù)號除外）攘乒，返回NaN。

parseInt('abc') // NaN
parseInt('.3') // NaN
parseInt('') // NaN
parseInt('+') // NaN
parseInt('+1') // 1

注：parseInt()方法默認(rèn)轉(zhuǎn)換成十進(jìn)制惋鹅，不過需要注意的是持灰，如果參數(shù)本身就是number類型，且是0x開頭（16進(jìn)制）负饲，或0o開頭（八進(jìn)制）堤魁，0b開頭（二進(jìn)制），0開頭且后面的數(shù)字沒有8和9（視為八進(jìn)制）返十，那么parseInt方法會將其以相應(yīng)的進(jìn)制轉(zhuǎn)換成十進(jìn)制展示出來妥泉。

parseInt(0o377)  //255
parseInt(0xff)  //255
parseInt(0b11)  //3

如果字符串以0x或0X開頭，parseInt會將其按照十六進(jìn)制數(shù)解析洞坑。

parseInt('0x10') // 16

如果字符串以0開頭盲链，將其按照10進(jìn)制解析。

parseInt('011') // 11

因此，為了防止意外解析成其他進(jìn)制刽沾，建議添加第二個參數(shù)按照特定進(jìn)制解析：如：
如果第二個參數(shù)不是數(shù)值本慕，會被自動轉(zhuǎn)為一個整數(shù)。這個整數(shù)只有在2到36之間侧漓，才能得到有意義的結(jié)果锅尘，超出這個范圍，則返回NaN布蔗。如果第二個參數(shù)是0藤违、undefined和null，則直接忽略纵揍。

parseInt('1000', 2) // 8
parseInt('1000', 6) // 216
parseInt('1000', 8) // 512
parseInt('10', 37) // NaN
parseInt('10', 1) // NaN
parseInt('10', 0) // 10
parseInt('10', null) // 10
parseInt('10', undefined) // 10

方法3：parseFloat()

parseFloat方法用于將一個字符串轉(zhuǎn)為浮點數(shù)顿乒。

parseFloat('3.14') // 3.14

如果字符串符合科學(xué)計數(shù)法，則會進(jìn)行相應(yīng)的轉(zhuǎn)換泽谨。

parseFloat('314e-2') // 3.14
parseFloat('0.0314E+2') // 3.14

如果字符串包含不能轉(zhuǎn)為浮點數(shù)的字符璧榄，則不再進(jìn)行往后轉(zhuǎn)換，返回已經(jīng)轉(zhuǎn)好的部分吧雹。

parseFloat('3.14more non-digit characters') // 3.14

parseFloat與Number的對比

parseFloat(true)  // NaN
Number(true) // 1

parseFloat(null) // NaN
Number(null) // 0

parseFloat('') // NaN
Number('') // 0

parseFloat('123.45#') // 123.45
Number('123.45#') // NaN

方法4：'?' - 0（老司機做法）

字符串 - 0犹菱。如：'11' - 0 //11`

方法5： + '?'

另辟蹊徑的方法： + 字符串，這里的+并不是取正值的意思吮炕，負(fù)數(shù)一樣可行，如：+ '-011' ; // -11
注：上面介紹的使用運算符的轉(zhuǎn)換方法访得，字符串不能有除了數(shù)字外的其他字符（正負(fù)號龙亲，表示進(jìn)制的標(biāo)識除外），字符串中悍抑，0b鳄炉、0x、0o開頭會以對應(yīng)表示的進(jìn)制解析搜骡，如果是'011'拂盯，則會解析成十進(jìn)制而不是二進(jìn)制，小數(shù)同樣可以用這兩種方法進(jìn)行轉(zhuǎn)換
小Tips：

• Number方法基本上记靡，只要有一個字符無法轉(zhuǎn)成數(shù)值谈竿，整個字符串就會被轉(zhuǎn)為NaN
• parseInt方法為了防止意外解析成其他進(jìn)制，建議添加第二個參數(shù)按照特定進(jìn)制解析
• parseFloat會將空字符串轉(zhuǎn)為NaN

如何將將其他數(shù)據(jù)類型轉(zhuǎn)換為Boolean布爾類型摸吠？

小白做法：Boolean() 空凸，如：

Boolean(1)  //true
Boolean({})  //true

老司機做法：雙重取反：!! x ，如：

!true //false
!!true //true
!!1 //true

五個falsy值寸痢，即轉(zhuǎn)換成Boolean后為false的值：
0 呀洲、 NaN 、 null 、 undefined 道逗、‘’（空字符串）

JS中的數(shù)據(jù)在內(nèi)存中的存儲方式

什么是內(nèi)存呢兵罢，舉個例子：

你買一個8G 的內(nèi)存條，操作系統(tǒng)開機即占用 512MB滓窍，Chrome 打開即占用 1G 內(nèi)存卖词， Chrome 各每個網(wǎng)頁分配一定數(shù)量的內(nèi)存， 這些內(nèi)存要分給頁面渲染器贰您、網(wǎng)絡(luò)模塊坏平、瀏覽器外殼和 JS 引擎（V8引擎）。
JS 引擎將內(nèi)存分為代碼區(qū)和數(shù)據(jù)區(qū)锦亦， 我們只研究數(shù)據(jù)區(qū)舶替。 數(shù)據(jù)區(qū)分為 Stack（棧內(nèi)存）和 Heap（堆內(nèi)存）。 簡單類型的數(shù)據(jù)（如Number杠园，string等）直接存在 Stack 里顾瞪， 復(fù)雜類型的數(shù)據(jù)（object對象）是把 Heap 地址存在 Stack 里。

對象存儲數(shù)據(jù)的方式

對象的存儲方式是在stack棧內(nèi)存存儲一個地址抛蚁，形成對對象的引用陈醒，地址指向heap堆內(nèi)存的某個位置，object是對象的引用瞧甩。它在stack棧內(nèi)存存的是地址钉跷，而不像其他數(shù)據(jù)類型直接把內(nèi)容存在stack棧內(nèi)存

垃圾回收

JS中的垃圾回收機制：如果一個對象沒有被引用，它就是垃圾肚逸，將會被回收爷辙。（時間并不確定的）
內(nèi)存泄漏就和垃圾回收機制有一定的聯(lián)系：由于瀏覽器的一些bug，使得本應(yīng)被被標(biāo)記為垃圾的數(shù)據(jù)沒有被標(biāo)記朦促，而這些垃圾數(shù)據(jù)占用的內(nèi)存將永遠(yuǎn)被占用膝晾，哪怕你把當(dāng)前頁面關(guān)掉都不會被釋放，除非直接關(guān)掉整個瀏覽器务冕。（IE6就有此類bug）
解決方法：（但是要抵制IE低版本瀏覽器）

window.onunload = function(){
  //需要將所有的事件監(jiān)聽為null血当，十分麻煩
  document.body.onclick = null;
}

四個關(guān)于內(nèi)存的題目

畫內(nèi)存圖（解決問題的方法），只要你不畫圖禀忆，就會錯臊旭，以不變應(yīng)萬變
題目一：

var a = 1;
var b = a;
b =2;
 //請問 a 是什么？   
//a = ? => a === 1

使用內(nèi)存圖解決思路：

題目一.png

題目二：

var a = {name:'a'};
var b = a;
b = {name: 'b'};
 //請問 a.name 是什么箩退？  
//a.name === " a"

題目二.png

題目三：

var a = {name: 'a'};
var b = a;
b.name = 'b'巍扛；
 //請問 a.name 是什么？  
//a.name === " b"

題目三.png

題目四：

var a = {name:'a'};
var b = a;
b = null;
 //請問 a是什么乏德？  
//a === {name: 'a'}

題目四.png

面試題

var a = {n:1};  
var b = a; 
a.x = a = {n:2};  
alert(a.x);
alert(b.x);

坑爹的面試題撤奸，a.x = a = {n:2};這句話是什么意思吠昭？瀏覽器看到這句話，就會問a是什么胧瓜？
瀏覽器讀到a.x = a = {n:2};這句話時矢棚，先看左面，再往右邊看

a.x = a = {n:2}
//a = {n:2},此時的a指向新的地址
//a.x還是之前的地址府喳，并沒有發(fā)生改變

注：這些箭頭并不是真實存在的蒲肋，只是虛擬的示意

面試題.png

深拷貝與淺拷貝

深拷貝：

var a = 1;
var b = a;
b = 2 ;
//請問a是什么？

a的值仍然還是1钝满。
即 b 變而不影響 a兜粘，就叫深拷貝（簡單數(shù)據(jù)類型的賦值都是深拷貝）
淺拷貝

var a = {x:1} ;
var b = a ;
b.x = 2;

b 變而導(dǎo)致 a變，就叫淺拷貝

JS中對象的循環(huán)引用

var obj = {name:'frank'} ; 
obj.self = obj; 
obj.self.self.self.name; // "'frank"

上述代碼就可以實現(xiàn)對象的循環(huán)引用弯蚜，原理是：為對象添加一個屬性孔轴，屬性值就是對象自己（在內(nèi)存中就是對象引用的地址），從而達(dá)到可以通過引用該對象的self屬性來引用對象本身碎捺。

參考資料：
阮一峰JavaScript 標(biāo)準(zhǔn)參考教程
JS 里的數(shù)據(jù)類型轉(zhuǎn)換