前言：之前的博客JS里的數(shù)據(jù)類型介紹了JS中的各種數(shù)據(jù)類型，那么可不可以把其他的數(shù)據(jù)類型轉(zhuǎn)換成特定的一種數(shù)據(jù)類型呢刁岸？本文就將介紹一些方法達(dá)成此目的塞颁，另外還會(huì)簡單引申JS中的內(nèi)存圖走贪、關(guān)于的內(nèi)存的相關(guān)題目、深拷貝與淺拷貝等相關(guān)知識(shí)缰盏。
如何將其他的數(shù)據(jù)類型轉(zhuǎn)換成String字符串類型涌萤？
注：下面介紹的三種轉(zhuǎn)換成字符串的方法都不適用于對(duì)象object（腰間盤真突出），所得結(jié)果都是"[object Object]",但是對(duì)于函數(shù)和數(shù)組是可以轉(zhuǎn)換的
?.toString()String(?)-
''+ ?
上面的問號(hào)口猜？代表是其他數(shù)據(jù)類型负溪，這樣可以快速得知使用方法
方法1：?.toString()（小白做法）
toString方法適用于number類型和boolean類型，但是將數(shù)字轉(zhuǎn)換為字符串時(shí)济炎，要特別注意川抡，如
//將數(shù)字轉(zhuǎn)換為字符串錯(cuò)誤寫法
1.toString() //Uncaught SyntaxError: Invalid or unexpected token
//正確寫法
(1).toString() //"1"
true.toString() //"true"
但是對(duì)于null和undefined，使用這種方法會(huì)報(bào)錯(cuò)须尚，如：
報(bào)錯(cuò)信息揭秘：
不能讀null的toString方法崖堤，null沒有toString的api，所以報(bào)錯(cuò)耐床，undefined類似
null.toString() //Uncaught TypeError: Cannot read property 'toString' of null
undefined.toString() //Uncaught TypeError: Cannot read property 'toString' of undefined
對(duì)于object密幔，toSring方法結(jié)果不正確，結(jié)果永遠(yuǎn)是"[object Object]"撩轰，函數(shù)和數(shù)組是比較特別,具體請(qǐng)看代碼
//錯(cuò)誤寫法
{}.toString() //Uncaught SyntaxError: Unexpected token .
//正確寫法
({}).toString() //"[object Object]"
var obj = {}
obj.toString() //結(jié)果為 "[object Object]"
//函數(shù)
//錯(cuò)誤寫法
function(){}.toString() //Uncaught SyntaxError: Unexpected token (
//正確寫法
(function(){}).toString() //"function(){}"
//數(shù)組
[].toString() //""
[1,2,3].toString() //"1,2,3"
方法2：String(?)（小白做法）
String() 該方法適用于所有數(shù)據(jù)類型（除了對(duì)象胯甩，結(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：''+ ?（老司機(jī)做法）
注：這種方法的原理是：‘+’ 運(yùn)算符只能相加相同的數(shù)據(jù)類型，如果兩邊的數(shù)據(jù)類型不同堪嫂，他會(huì)優(yōu)先將其轉(zhuǎn)換成字符串來相加偎箫。
''+ ? 即使用+運(yùn)算符加上空字符串（同樣對(duì)object無效）該方法適用于所有數(shù)據(jù)類型（除了對(duì)象，結(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"
踩坑時(shí)間到
小谷問：1+'1'的結(jié)果是多少皆串？
小白說：你這是看不起我嗎淹办？2啊
小谷說：你踩坑啦，當(dāng)然不是恶复，具體娇唯，我一一給你道來
1+'1' //"11"
//上面的做法，相當(dāng)于是下面這個(gè)步驟寂玲，根據(jù)上面的那個(gè)原理得出
(1).toString() + '1' //"11"
小Tips：
- 三種轉(zhuǎn)換成字符串的方法對(duì)于對(duì)象來說，是特殊的
- 使用這種方法
?.toString()報(bào)錯(cuò)梗摇，只需給需要轉(zhuǎn)換的東西加上個(gè)括號(hào)拓哟，具體例子請(qǐng)看上面
如何將其他的數(shù)據(jù)類型轉(zhuǎn)換成Number數(shù)值類型？
注：parseInt逐個(gè)解析字符伶授，而Number函數(shù)整體轉(zhuǎn)換字符串的類型断序。parseInt,parseFloat和Number函數(shù)都會(huì)自動(dòng)過濾一個(gè)字符串前導(dǎo)和后綴的空格流纹。parseInt(?,?)說明parseInt可以有兩個(gè)參數(shù)
Number(?)parseInt(?,?)parseFloat(?)'?' - 0+ '?'
方法1：Number(?)
使用Number函數(shù)，可以將任意類型的值轉(zhuǎn)化成數(shù)值违诗。Number函數(shù)將字符串轉(zhuǎn)為數(shù)值漱凝，要比parseInt函數(shù)嚴(yán)格很多。基本上诸迟，只要有一個(gè)字符無法轉(zhuǎn)成數(shù)值茸炒，整個(gè)字符串就會(huì)被轉(zhuǎn)為NaN。
下面分成兩種情況討論阵苇，一種是參數(shù)是原始類型的值壁公，另一種是參數(shù)是對(duì)象。
（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）對(duì)象
Number方法的參數(shù)是對(duì)象時(shí)快耿，將返回NaN囊陡，除非是包含單個(gè)數(shù)值的數(shù)組。
示例如下：
Number({a: 1}) // NaN
Number([1, 2, 3]) // NaN
Number([5]) // 5
Number背后的轉(zhuǎn)換規(guī)則比較復(fù)雜掀亥。
第一步撞反，調(diào)用對(duì)象自身的valueOf方法。如果返回原始類型的值铺浇，則直接對(duì)該值使用Number函數(shù)痢畜，不再進(jìn)行后續(xù)步驟。
第二步鳍侣，如果valueOf方法返回的還是對(duì)象丁稀，則改為調(diào)用對(duì)象自身的toString方法。如果toString方法返回原始類型的值倚聚，則對(duì)該值使用Number函數(shù)线衫，不再進(jìn)行后續(xù)步驟。
第三步惑折，如果toString方法返回的是對(duì)象授账，就報(bào)錯(cuò)。
方法2：parseInt()
parseInt方法用于將字符串轉(zhuǎn)為整數(shù)惨驶。
如：parseInt('123') // 123
如果字符串頭部有空格白热，空格會(huì)被自動(dòng)去除。parseInt(' 81') // 81
如果parseInt的參數(shù)不是字符串粗卜，則會(huì)先轉(zhuǎn)為字符串再轉(zhuǎn)換屋确。
parseInt(1.23) // 1
// 等同于
parseInt('1.23') // 1
字符串轉(zhuǎn)為整數(shù)的時(shí)候，是一個(gè)個(gè)字符依次轉(zhuǎn)換，如果遇到不能轉(zhuǎn)為數(shù)字的字符攻臀，就不再進(jìn)行下去焕数，返回已經(jīng)轉(zhuǎn)好的部分。
parseInt('8a') // 8
parseInt('15e2') // 15
parseInt('15px') // 15
如果字符串的第一個(gè)字符不能轉(zhuǎn)化為數(shù)字（后面跟著數(shù)字的正負(fù)號(hào)除外）刨啸，返回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方法會(huì)將其以相應(yīng)的進(jìn)制轉(zhuǎn)換成十進(jìn)制展示出來粘招。
parseInt(0o377) //255
parseInt(0xff) //255
parseInt(0b11) //3
如果字符串以0x或0X開頭啥寇，parseInt會(huì)將其按照十六進(jìn)制數(shù)解析。
parseInt('0x10') // 16
如果字符串以0開頭洒扎，將其按照10進(jìn)制解析辑甜。
parseInt('011') // 11
因此，為了防止意外解析成其他進(jìn)制袍冷，建議添加第二個(gè)參數(shù)按照特定進(jìn)制解析：如：
如果第二個(gè)參數(shù)不是數(shù)值磷醋，會(huì)被自動(dòng)轉(zhuǎn)為一個(gè)整數(shù)。這個(gè)整數(shù)只有在2到36之間胡诗，才能得到有意義的結(jié)果邓线，超出這個(gè)范圍，則返回NaN煌恢。如果第二個(gè)參數(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方法用于將一個(gè)字符串轉(zhuǎn)為浮點(diǎn)數(shù)你雌。
parseFloat('3.14') // 3.14
如果字符串符合科學(xué)計(jì)數(shù)法，則會(huì)進(jìn)行相應(yīng)的轉(zhuǎn)換二汛。
parseFloat('314e-2') // 3.14
parseFloat('0.0314E+2') // 3.14
如果字符串包含不能轉(zhuǎn)為浮點(diǎn)數(shù)的字符婿崭，則不再進(jìn)行往后轉(zhuǎn)換，返回已經(jīng)轉(zhuǎn)好的部分肴颊。
parseFloat('3.14more non-digit characters') // 3.14
parseFloat與Number的對(duì)比
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（老司機(jī)做法）
字符串 - 0氓栈。如：'11' - 0 //11`
方法5： + '?'
另辟蹊徑的方法： + 字符串，這里的+并不是取正值的意思婿着，負(fù)數(shù)一樣可行颤绕，如：+ '-011' ; // -11
注：上面介紹的使用運(yùn)算符的轉(zhuǎn)換方法幸海，字符串不能有除了數(shù)字外的其他字符（正負(fù)號(hào)，表示進(jìn)制的標(biāo)識(shí)除外）奥务，字符串中，0b袜硫、0x氯葬、0o開頭會(huì)以對(duì)應(yīng)表示的進(jìn)制解析，如果是'011'婉陷，則會(huì)解析成十進(jìn)制而不是二進(jìn)制帚称，小數(shù)同樣可以用這兩種方法進(jìn)行轉(zhuǎn)換
小Tips：
- Number方法基本上，只要有一個(gè)字符無法轉(zhuǎn)成數(shù)值秽澳，整個(gè)字符串就會(huì)被轉(zhuǎn)為NaN
- parseInt方法為了防止意外解析成其他進(jìn)制闯睹，建議添加第二個(gè)參數(shù)按照特定進(jìn)制解析
- parseFloat會(huì)將空字符串轉(zhuǎn)為NaN
如何將將其他數(shù)據(jù)類型轉(zhuǎn)換為Boolean布爾類型？
小白做法：Boolean() 担神，如：
Boolean(1) //true
Boolean({}) //true
老司機(jī)做法：雙重取反：!! x 楼吃，如：
!true //false
!!true //true
!!1 //true
五個(gè)falsy值，即轉(zhuǎn)換成Boolean后為false的值：
0 妄讯、 NaN 孩锡、 null 、 undefined 亥贸、‘’（空字符串）
JS中的數(shù)據(jù)在內(nèi)存中的存儲(chǔ)方式
什么是內(nèi)存呢躬窜，舉個(gè)例子：
你買一個(gè)8G 的內(nèi)存條，操作系統(tǒng)開機(jī)即占用 512MB炕置，Chrome 打開即占用 1G 內(nèi)存荣挨， Chrome 各每個(gè)網(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對(duì)象）是把 Heap 地址存在 Stack 里。
對(duì)象存儲(chǔ)數(shù)據(jù)的方式
對(duì)象的存儲(chǔ)方式是在stack棧內(nèi)存存儲(chǔ)一個(gè)地址这溅，形成對(duì)對(duì)象的引用组民，地址指向heap堆內(nèi)存的某個(gè)位置，object是對(duì)象的引用悲靴。它在stack棧內(nèi)存存的是地址臭胜，而不像其他數(shù)據(jù)類型直接把內(nèi)容存在stack棧內(nèi)存
垃圾回收
JS中的垃圾回收機(jī)制：如果一個(gè)對(duì)象沒有被引用，它就是垃圾，將會(huì)被回收耸三。（時(shí)間并不確定的）
內(nèi)存泄漏就和垃圾回收機(jī)制有一定的聯(lián)系：由于瀏覽器的一些bug乱陡，使得本應(yīng)被被標(biāo)記為垃圾的數(shù)據(jù)沒有被標(biāo)記，而這些垃圾數(shù)據(jù)占用的內(nèi)存將永遠(yuǎn)被占用仪壮，哪怕你把當(dāng)前頁面關(guān)掉都不會(huì)被釋放憨颠，除非直接關(guān)掉整個(gè)瀏覽器。（IE6就有此類bug）
解決方法：（但是要抵制IE低版本瀏覽器）
window.onunload = function(){
//需要將所有的事件監(jiān)聽為null积锅，十分麻煩
document.body.onclick = null;
}
四個(gè)關(guān)于內(nèi)存的題目
畫內(nèi)存圖（解決問題的方法）爽彤，只要你不畫圖，就會(huì)錯(cuò)缚陷，以不變應(yīng)萬變
題目一：
var a = 1;
var b = a;
b =2;
//請(qǐng)問 a 是什么适篙？
//a = ? => a === 1
使用內(nèi)存圖解決思路：
題目二：
var a = {name:'a'};
var b = a;
b = {name: 'b'};
//請(qǐng)問 a.name 是什么？
//a.name === " a"
題目三：
var a = {name: 'a'};
var b = a;
b.name = 'b'箫爷；
//請(qǐng)問 a.name 是什么嚷节？
//a.name === " b"
題目四：
var a = {name:'a'};
var b = a;
b = null;
//請(qǐng)問 a是什么？
//a === {name: 'a'}
面試題
var a = {n:1};
var b = a;
a.x = a = {n:2};
alert(a.x);
alert(b.x);
坑爹的面試題蝶缀，a.x = a = {n:2};這句話是什么意思丹喻？瀏覽器看到這句話，就會(huì)問a是什么翁都？
瀏覽器讀到a.x = a = {n:2};這句話時(shí)碍论，先看左面，再往右邊看
a.x = a = {n:2}
//a = {n:2},此時(shí)的a指向新的地址
//a.x還是之前的地址柄慰，并沒有發(fā)生改變
注：這些箭頭并不是真實(shí)存在的鳍悠，只是虛擬的示意
深拷貝與淺拷貝
深拷貝：
var a = 1;
var b = a;
b = 2 ;
//請(qǐng)問a是什么？
a的值仍然還是1坐搔。
即 b 變而不影響 a藏研，就叫深拷貝（簡單數(shù)據(jù)類型的賦值都是深拷貝）
淺拷貝
var a = {x:1} ;
var b = a ;
b.x = 2;
b 變而導(dǎo)致 a變，就叫淺拷貝
JS中對(duì)象的循環(huán)引用
var obj = {name:'frank'} ;
obj.self = obj;
obj.self.self.self.name; // "'frank"
上述代碼就可以實(shí)現(xiàn)對(duì)象的循環(huán)引用概行，原理是：為對(duì)象添加一個(gè)屬性蠢挡，屬性值就是對(duì)象自己（在內(nèi)存中就是對(duì)象引用的地址），從而達(dá)到可以通過引用該對(duì)象的self屬性來引用對(duì)象本身凳忙。
參考資料：
阮一峰JavaScript 標(biāo)準(zhǔn)參考教程
JS 里的數(shù)據(jù)類型轉(zhuǎn)換
