前言：之前的博客介紹了JS中的各種數(shù)據(jù)類型排龄，那么可不可以把已經(jīng)確定的數(shù)據(jù)類型轉(zhuǎn)換成其他的數(shù)據(jù)類型呢？本文就將介紹一些方法達成此目的届垫，另外還會引申的簡單介紹一下JS中的內(nèi)存管理释液、深拷貝與淺拷貝等相關(guān)知識。
1装处、如何將其他的數(shù)據(jù)類型轉(zhuǎn)換成String字符串類型误债？
注：下面介紹的三種轉(zhuǎn)換成字符串的方法都不適用于對象，所得結(jié)果都是"[object Object]"
-
toSring()
toString方法適用于number類型和boolean類型妄迁，如：
true.toString(); // "true"
(11).toString(); // "11"
但是對于null和undefined寝蹈，使用這種方法會報錯，如：
undefined.toString(); // Cannot read property 'toString' of undefined
null.toString(); // Cannot read property 'toString' of null
對于object登淘，toSring方法結(jié)果不正確箫老，結(jié)果永遠是"[object Object]"
var obj = {}
obj.toString()
==> 結(jié)果為 "[object Object]"
-
String()該方法適用于所有數(shù)據(jù)類型（除了對象，結(jié)果同toString()）
String(obj); // "[object Object]"
String(11); // "11"
String(true); // "true"
String(undefined); // "undefined"
-
+ ''即使用+運算符加上空字符串（同樣對object無效）
注：上面介紹的toString()以及String()方法是比較常規(guī)的方法黔州，而這種不常規(guī)的操作耍鬓，才是程序員的日常。這種方法的原理是：‘+’ 運算符只能相加相同的數(shù)據(jù)類型流妻，如果兩邊的數(shù)據(jù)類型不同牲蜀，他會優(yōu)先將其轉(zhuǎn)換成字符串來相加。因此就有一個很常見的坑：1+'1'的結(jié)果是多少绅这？有些經(jīng)驗尚淺的程序員會以為結(jié)果是2涣达，但很明顯，這句話是按照字符串相加的規(guī)則來計算的证薇，所以結(jié)果為"11"
使用此方法轉(zhuǎn)換成字符串的例子如下：
true+""; // "true"
undefined+""; // "undefined"
obj+""; // "[object Object]"
11+""; // "11"
2度苔、如何將其他的數(shù)據(jù)類型轉(zhuǎn)換成Number數(shù)值類型？
-
Number()
使用Number函數(shù)浑度，可以將任意類型的值轉(zhuǎn)化成數(shù)值寇窑。Number函數(shù)將字符串轉(zhuǎn)為數(shù)值，要比parseInt函數(shù)嚴格很多箩张。基本上疗认，只要有一個字符無法轉(zhuǎn)成數(shù)值，整個字符串就會被轉(zhuǎn)為NaN伏钠。
示例如下：
// 數(shù)值：轉(zhuǎn)換后還是原來的值
Number(324) // 324
// 字符串：如果可以被解析為數(shù)值横漏，則轉(zhuǎn)換為相應的數(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
-
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īng)轉(zhuǎn)好的部分踩验，如：
parseInt('12.34') // 12
parseInt('15e2') // 15
parseInt('15px') // 15
如果字符串的第一個字符不能轉(zhuǎn)化為數(shù)字（后面跟著數(shù)字的正負號除外）鸥诽，返回NaN。
parseInt('abc') // NaN
parseInt('.3') // NaN
parseInt('') // NaN
parseInt('+') // NaN
parseInt('+1') // 1
注：parseInt()方法默認轉(zhuǎn)換成十進制箕憾，不過需要注意的是牡借，如果參數(shù)本身就是number類型，且是0x開頭（16進制）袭异，或0o開頭（八進制）钠龙，0b開頭（二進制），0開頭且后面的數(shù)字沒有8和9（視為八進制）御铃，那么parseInt方法會將其以相應的進制轉(zhuǎn)換成十進制展示出來碴里。另外，如果參數(shù)是0x開頭的字符串上真，也會以16進制解析咬腋，如parseInt('0x10') // 16
因此，為了防止意外解析成其他進制谷羞，建議添加第二個參數(shù)按照特定進制解析：如：
parseInt('0x16'); // 22
parseInt('0x16',10) ; // 0
-
parseFloat()
parseFloat方法用于將一個字符串轉(zhuǎn)為浮點數(shù)。parseFloat('3.14') // 3.14
如果字符串符合科學計數(shù)法溜徙，則會進行相應的轉(zhuǎn)換湃缎。
parseFloat('314e-2') // 3.14
parseFloat('0.0314E+2') // 3.14
如果字符串包含不能轉(zhuǎn)為浮點數(shù)的字符，則不再進行往后轉(zhuǎn)換蠢壹，返回已經(jīng)轉(zhuǎn)好的部分嗓违。如：parseFloat('3.14more non-digit characters') // 3.14
parseFloat方法會自動過濾字符串前導的空格。如：parseFloat('\t\v\r12.34\n ') // 12.34
如果參數(shù)不是字符串图贸，或者字符串的第一個字符不能轉(zhuǎn)化為浮點數(shù)蹂季，則返回NaN。
parseFloat([]) // NaN
parseFloat('FF2') // NaN
parseFloat('') // NaN 注意疏日，parseFloat會將空字符串轉(zhuǎn)為NaN偿洁。
parseFloat的轉(zhuǎn)換結(jié)果不同于Number函數(shù)的地方如下：
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
- 程序員愛用的非常規(guī)方法：字符串 - 0
如：'22' - 0 - 更加非常規(guī)的方法： + 字符串，這里的+并不是取正值的意思沟优，負數(shù)一樣可行
如：+ '22'涕滋、+ '-011' ; // -11
注意：上面介紹的使用運算符的轉(zhuǎn)換方法，字符串不能有除了數(shù)字外的其他字符（正負號挠阁，表示進制的標識除外）宾肺，字符串中溯饵，0b、0x锨用、0o開頭會以對應表示的進制解析丰刊，如果是'011'，則會解析成十進制而不是二進制增拥，小數(shù)同樣可以用這兩種方法進行轉(zhuǎn)換：
'011'-0 // 11
'0b11'-0 // 3
'0o11'-0 // 9
'0x11'-0 // 17
'0x11.1'-0 // NaN
'011.1'-0 // 11.1
3啄巧、如何將將其他數(shù)據(jù)類型轉(zhuǎn)換為Boolean布爾類型？
- 常規(guī)方法：
Boolean()跪者，如：
Boolean("ss"); // true
Boolean({}); // true
- 程序員喜歡用的非常規(guī)方法 棵帽，雙重取反：
!! x，如：
!!"ss" ; // true
!!NaN ; // false
!!{} ; // true
- 五個falsy值渣玲，即轉(zhuǎn)換成Boolean后為false的值：
0 逗概、 NaN 、 null 忘衍、 undefined 逾苫、‘’（空字符串）
4、關(guān)于JS中的數(shù)據(jù)在內(nèi)存中的存儲方式
-
內(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 里饭于， 復雜類型的數(shù)據(jù)（object對象）是把 Heap 地址存在 Stack 里蜀踏。如圖：
JS存儲數(shù)據(jù) 對象的存儲方式
上一條說了，對象的存儲方式是在stack內(nèi)存存儲一個地址掰吕，形成對對象的引用果覆，地址指向heap內(nèi)存的某個位置，這樣才能達到可以隨時為對象添加或刪除內(nèi)容的目的殖熟。所以有句話這么說随静，object是對象的引用。它在stack內(nèi)存存的是地址，而不像其他數(shù)據(jù)類型直接把內(nèi)容存在stack內(nèi)存燎猛。內(nèi)存圖
因此恋捆，這里就要引入“內(nèi)存圖”的概念，方便解決一些復雜問題重绷，具體的內(nèi)存圖樣式和應用會在第六部分的面試題中體現(xiàn)沸停。垃圾回收
JS中的垃圾回收機制：如果一個對象沒有被引用，他就是垃圾昭卓，將會被回收愤钾。
內(nèi)存泄漏就和垃圾回收機制有一定的聯(lián)系：由于瀏覽器的一些bug，使得本應被被標記為垃圾的數(shù)據(jù)沒有被標記候醒，而這些垃圾數(shù)據(jù)占用的內(nèi)存將永遠被占用能颁，哪怕你把當前頁面關(guān)掉都不會被釋放，除非直接關(guān)掉整個瀏覽器倒淫。（IE6就有此類bug）
5伙菊、深拷貝與淺拷貝
-
深拷貝：
先舉個例子：
var a = 1;
var b = a;
b = 2 ;
那么經(jīng)過了上述操作，很明顯a的值仍然還是1敌土。
即 b 變而不影響 a镜硕，就叫深拷貝（簡單數(shù)據(jù)類型的賦值都是深拷貝）
-
淺拷貝
同樣舉個栗子先：
var a = {x:1} ;
var b = a ;
b.x = 2;
經(jīng)過了上述操作，明顯返干，a.x也變成了2.
即 b 變而導致了a變兴枯，這就是淺拷貝。
- 那么有人就問了矩欠，難道對象就不能實現(xiàn)深拷貝了嗎财剖？
當然……不是，對象的深拷貝的基本原理大概就是在b = a的這個環(huán)節(jié)癌淮，讓 a所引用的對象復制一份躺坟，然后重新存在heap內(nèi)存中的另一個位置，然后b再引用新生成的對象的地址该默，這樣就實現(xiàn)了對象的深拷貝瞳氓，不過具體代碼很復雜策彤，這里暫且不表栓袖。
6、幾道面試題目
- 題目一：
var a = 1
var b = a
b = 2
請問 a 顯示是幾店诗？
內(nèi)存圖解決思路：
- 題目二：
var a = {name: 'a'}
var b = a
b = {name: 'b'}
請問現(xiàn)在 a.name 是多少裹刮？
- 題目三：
var a = {name: 'a'}
var b = a
b.name = 'b'
請問現(xiàn)在 a.name 是多少？
- 題目四：
var a = {name: 'a'}
var b = a
b = null
請問現(xiàn)在 a 是什么庞瘸？
- 題目五：
var a = {n:1};
var b = a;
a.x = a = {n:2};
alert(a.x);
alert(b.x);
這道題最坑的一點在這句話a.x = a = {n:2};捧弃，很顯然如果在日常工作中這么寫代碼遲早得被打死，但是既然作為題目被寫出來了，那咱們還是先仔細分析一下這句話：
賦值是從右到左的违霞，但不要被繞暈了嘴办， 其實很簡單，從運算符優(yōu)先級來考慮
a.x = a = {n:2};
.運算優(yōu)先于=賦值運算买鸽，因此此處賦值可理解為
聲明a對象中的x屬性涧郊，用于賦值，此時b指向a眼五，同時擁有未賦值的x屬性
對a對象賦值妆艘，此時變量名a改變指向到對象{n:2}
對步驟1中x屬性，也即a原指向?qū)ο蟮膞屬性看幼，也即b指向?qū)ο蟮膞屬性賦值
賦值結(jié)果：
a => {n: 2}
b => {n: 1, x: {n: 2 } }
然后老辦法批旺，我們畫個內(nèi)存圖分析一下吧：
7、JS中對象的循環(huán)引用
什么是對象的循環(huán)引用呢诵姜？舉個例子先：
var obj = {name:'enoch'} ;
obj.self = obj;
obj.self.self.self.name; // "enoch"
上述代碼就可以實現(xiàn)對象的循環(huán)引用汽煮，原理是：為對象添加一個屬性，屬性值就是對象自己（在內(nèi)存中就是對象引用的地址）茅诱，從而達到可以通過引用該對象的self屬性來引用對象本身逗物。
