JavaScript里的數(shù)據(jù)類型轉(zhuǎn)換和小技巧

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

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

(1) ?.toString()

(2) String(?)

(3) ''+ ?

上面的問號(hào)勾笆?代表是其他數(shù)據(jù)類型荤崇,這樣可以快速得知使用方法

方法1:?.toString()(小白做法)

toString方法適用于number類型和boolean類型瘦棋,但是將數(shù)字轉(zhuǎn)換為字符串時(shí)澄成,要特別注意吹榴,如


但是對(duì)于null和undefined亭敢,使用這種方法會(huì)報(bào)錯(cuò),如:

報(bào)錯(cuò)信息揭秘:

不能讀null的toString方法图筹,null沒有toString的api帅刀,所以報(bào)錯(cuò)让腹,undefined類似


對(duì)于object,toSring方法結(jié)果不正確扣溺,結(jié)果永遠(yuǎn)是"[object Object]"骇窍,函數(shù)和數(shù)組是比較特別,具體請(qǐng)看代碼



方法2:String(?)(小白做法)

String() 該方法適用于所有數(shù)據(jù)類型(除了對(duì)象,結(jié)果同toString())



方法3:''+ ?(老司機(jī)做法锥余,推薦使用)

注:這種方法的原理是:‘+’ 運(yùn)算符只能相加相同的數(shù)據(jù)類型腹纳,如果兩邊的數(shù)據(jù)類型不同,他會(huì)優(yōu)先將其轉(zhuǎn)換成字符串來相加哈恰。

''+ ?即使用+運(yùn)算符加上空字符串(同樣對(duì)object無效)該方法適用于所有數(shù)據(jù)類型(除了對(duì)象只估,結(jié)果同toString())


踩坑時(shí)間到

小a問:1+'1'的結(jié)果是多少?

小b說:你這是看不起我嗎着绷?2啊

小a說:你踩坑啦蛔钙,當(dāng)然不是,具體荠医,我一一給你道來


小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ù)

(1) Number(?)

(2) parseInt(?,?)

(3) parseFloat(?)

(4) '?' - 0

(5) + '?'

方法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)原始類型值

示例如下:


(2)對(duì)象

Number方法的參數(shù)是對(duì)象時(shí)力喷,將返回NaN刽漂,除非是包含單個(gè)數(shù)值的數(shù)組。

示例如下:


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)換糊余。


字符串轉(zhuǎn)為整數(shù)的時(shí)候秀又,是一個(gè)個(gè)字符依次轉(zhuǎn)換,如果遇到不能轉(zhuǎn)為數(shù)字的字符贬芥,就不再進(jìn)行下去吐辙,返回已經(jīng)轉(zhuǎn)好的部分。


如果字符串的第一個(gè)字符不能轉(zhuǎn)化為數(shù)字(后面跟著數(shù)字的正負(fù)號(hào)除外)蘸劈,返回NaN昏苏。


注: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)制展示出來句柠。


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


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


因此帽哑,為了防止意外解析成其他進(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,則直接忽略度秘。

方法3:parseFloat()

parseFloat方法用于將一個(gè)字符串轉(zhuǎn)為浮點(diǎn)數(shù)顶伞。

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


如果字符串包含不能轉(zhuǎn)為浮點(diǎn)數(shù)的字符唆貌,則不再進(jìn)行往后轉(zhuǎn)換,返回已經(jīng)轉(zhuǎn)好的部分垢乙。


parseFloat與Number的對(duì)比



方法4:'?' - 0(老司機(jī)做法锨咙,強(qiáng)烈推薦!G壬摹1妥狻)

字符串 - 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:

1.Number方法基本上料睛,只要有一個(gè)字符無法轉(zhuǎn)成數(shù)值丐箩,整個(gè)字符串就會(huì)被轉(zhuǎn)為NaN

2.parseInt方法為了防止意外解析成其他進(jìn)制,建議添加第二個(gè)參數(shù)按照特定進(jìn)制解析

3.parseFloat會(huì)將空字符串轉(zhuǎn)為NaN



【三】 如何將將其他數(shù)據(jù)類型轉(zhuǎn)換為Boolean布爾類型恤煞?

小白做法:Boolean() 屎勘,如:



老司機(jī)做法:雙重取反:!! x ,如:


五個(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)頁(yè)分配一定數(shù)量的內(nèi)存, 這些內(nèi)存要分給頁(yè)面渲染器产喉、網(wǎng)絡(luò)模塊捂掰、瀏覽器外殼和 JS 引擎(V8引擎)。

JS 引擎將內(nèi)存分為代碼區(qū)和數(shù)據(jù)區(qū)曾沈, 我們只研究數(shù)據(jù)區(qū)这嚣。 數(shù)據(jù)區(qū)分為Stack(棧內(nèi)存)Heap(堆內(nèi)存)。 簡(jiǎn)單類型的數(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)前頁(yè)面關(guān)掉都不會(huì)被釋放,除非直接關(guān)掉整個(gè)瀏覽器匙姜。(IE6就有此類bug)

解決方法:(但是要抵制IE低版本瀏覽器)



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

畫內(nèi)存圖(解決問題的方法)畅厢,只要你不畫圖,就會(huì)錯(cuò)氮昧,以不變應(yīng)萬變

題目一:


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

題目二:


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

題目三:


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


題目四:


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


可能會(huì)遇到的面試題:

a.x = a = {n:2};這句話是什么意思或详?瀏覽器看到這句話,就會(huì)問a是什么郭计?

瀏覽器讀到a.x = a = {n:2};這句話時(shí),先看左面椒振,再往右邊看


注:這些箭頭并不是真實(shí)存在的昭伸,只是虛擬的示意





【五】深拷貝與淺拷貝

深拷貝:


a的值仍然還是1。即?b 變而不影響 a澎迎,就叫深拷貝(簡(jiǎn)單數(shù)據(jù)類型的賦值都是深拷貝)

淺拷貝


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




【六】JS中對(duì)象的循環(huán)引用


上述代碼就可以實(shí)現(xiàn)對(duì)象的循環(huán)引用选调,原理是:為對(duì)象添加一個(gè)屬性,屬性值就是對(duì)象自己(在內(nèi)存中就是對(duì)象引用的地址)灵份,從而達(dá)到可以通過引用該對(duì)象的self屬性來引用對(duì)象本身仁堪。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市填渠,隨后出現(xiàn)的幾起案子弦聂,更是在濱河造成了極大的恐慌,老刑警劉巖氛什,帶你破解...
    沈念sama閱讀 218,284評(píng)論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件莺葫,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡枪眉,警方通過查閱死者的電腦和手機(jī)捺檬,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,115評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來贸铜,“玉大人堡纬,你說我怎么就攤上這事≥锴兀” “怎么了烤镐?”我有些...
    開封第一講書人閱讀 164,614評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)渤早。 經(jīng)常有香客問我职车,道長(zhǎng),這世上最難降的妖魔是什么鹊杖? 我笑而不...
    開封第一講書人閱讀 58,671評(píng)論 1 293
  • 正文 為了忘掉前任悴灵,我火速辦了婚禮,結(jié)果婚禮上骂蓖,老公的妹妹穿的比我還像新娘积瞒。我一直安慰自己,他們只是感情好登下,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,699評(píng)論 6 392
  • 文/花漫 我一把揭開白布茫孔。 她就那樣靜靜地躺著,像睡著了一般被芳。 火紅的嫁衣襯著肌膚如雪缰贝。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,562評(píng)論 1 305
  • 那天畔濒,我揣著相機(jī)與錄音剩晴,去河邊找鬼。 笑死,一個(gè)胖子當(dāng)著我的面吹牛赞弥,可吹牛的內(nèi)容都是我干的毅整。 我是一名探鬼主播,決...
    沈念sama閱讀 40,309評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼绽左,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼悼嫉!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起拼窥,我...
    開封第一講書人閱讀 39,223評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤戏蔑,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后闯团,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體辛臊,經(jīng)...
    沈念sama閱讀 45,668評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,859評(píng)論 3 336
  • 正文 我和宋清朗相戀三年房交,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了彻舰。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,981評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡候味,死狀恐怖刃唤,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情白群,我是刑警寧澤尚胞,帶...
    沈念sama閱讀 35,705評(píng)論 5 347
  • 正文 年R本政府宣布,位于F島的核電站帜慢,受9級(jí)特大地震影響笼裳,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜粱玲,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,310評(píng)論 3 330
  • 文/蒙蒙 一躬柬、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧抽减,春花似錦允青、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,904評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至史汗,卻和暖如春琼掠,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背停撞。 一陣腳步聲響...
    開封第一講書人閱讀 33,023評(píng)論 1 270
  • 我被黑心中介騙來泰國(guó)打工瓷蛙, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,146評(píng)論 3 370
  • 正文 我出身青樓速挑,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親副硅。 傳聞我的和親對(duì)象是個(gè)殘疾皇子姥宝,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,933評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容