您好,登錄后才能下訂單哦!
這篇文章主要講解了javascript內(nèi)存模型的用法,內(nèi)容清晰明了,對此有興趣的小伙伴可以學(xué)習(xí)一下,相信大家閱讀完之后會(huì)有幫助。
當(dāng)我們聲明變量、初始化變量、更改變量值的時(shí)候,到底會(huì)發(fā)生什么?JavaScript 是如何實(shí)現(xiàn)這些基本的功能?最重要的是,我們?nèi)绾尾拍芾斫膺@些基礎(chǔ)知識?
本文將覆蓋以下 4 個(gè)方面:
從一個(gè)簡單的栗子開始。首先我們聲明一個(gè)叫myNumber
的變量,賦值為 23。
let myNumber = 23
執(zhí)行這段代碼的時(shí)候,JavaScript 會(huì)...
通常我們會(huì)說:“myNumber 等于 23”,但從技術(shù)上講,myNumber
等于一個(gè)內(nèi)存地址,那兒保存著一個(gè)大小為 23 的值。理解這段話十分關(guān)鍵。
如果我們創(chuàng)建一個(gè) newVar
的新變量,然后把 myNumber
賦值給它:
let newVar = myNumber
因?yàn)?myNumber
實(shí)際上等于“0012CCGWH80”,那么newVar
也等于“0012CCGWH80”,這個(gè)內(nèi)存地址保存的值為 23。最終實(shí)現(xiàn)了“newVal 等于 23”的效果。
如果我們這樣做又會(huì)發(fā)生什么呢?
myNumber = myNumber + 1
顯然,myNumber
的值為 24,那么對于指向相同內(nèi)存地址的newVar
,它是否也等于 24?
答案當(dāng)然是否定的!因?yàn)?JavaScript 的基本數(shù)據(jù)類型是不可變的,myNumber + 1
的結(jié)果是 24,JavaScript 會(huì)分配一個(gè)新的內(nèi)存地址來存儲這個(gè)值,然后將myNumber
指向這個(gè)新地址。
圖3
再舉一個(gè)例子:
let myString = 'abc' myString = myString + 'd'
JS 新手可能認(rèn)為,字符串abc
已經(jīng)存在于內(nèi)存里,所以字母d
只是追加到它的后面。從技術(shù)上講,這是錯(cuò)誤的。由于原始數(shù)據(jù)類型的不變性,當(dāng)abc
與d
結(jié)合時(shí),JS 會(huì)分配一個(gè)新的內(nèi)存地址來保存這個(gè)值(abcd
),接著myString
指向新的地址。
圖4
JS 的內(nèi)存模型可以簡單的理解為兩個(gè)不同的區(qū)域:調(diào)用棧和堆。
圖5
棧用來保存原始數(shù)據(jù)以及函數(shù)調(diào)用,可以粗略的用下圖表示。
圖6
上圖中,我抽象的在調(diào)用棧中顯示每個(gè)變量的值。但請記住,變量實(shí)際指向的是內(nèi)存地址,那里保存著對應(yīng)的值。這是理解let vs. cont
的關(guān)鍵。
關(guān)于堆內(nèi)存。
堆保存著所有非原始類型的數(shù)據(jù)。它和棧最大的區(qū)別是,堆可以保存無序、能夠動(dòng)態(tài)增刪的數(shù)據(jù)——對于對象和數(shù)組來說,這是完美的存儲空間。
還是從一個(gè)簡單的栗子開始。下面,我們聲明一個(gè)叫myArray
的變量,并初始化一個(gè)空數(shù)組。
let myArray = []
當(dāng) JS 引擎執(zhí)行上面的代碼,內(nèi)存會(huì)發(fā)生如下變化:
圖8
現(xiàn)在,我們可以對數(shù)組做任何操作了。
myArray.push('first') myArray.push('second') myArray.push('third') myArray.pop()
圖9
我們應(yīng)該優(yōu)先使用const
而不是let
,除非變量會(huì)被改變。
我們必須清楚的知道——“改變”到底是什么意思。
值發(fā)生了變化,這是對“改變”的一種錯(cuò)誤理解。一些 JS 程序員會(huì)寫下這樣的代碼:
let sum = 0 sum = 1 + 2 let numbers = [] numbers.push(1) numbers.push(2)
這段代碼正確的使用let
聲明變量sum
,因?yàn)橹当桓淖兞?。然而卻錯(cuò)誤的使用let
來聲明變量numbers
,因?yàn)樗麄冋J(rèn)為給數(shù)組 push 一些數(shù)據(jù)后,數(shù)組的值被改變了。
“改變”的正確解釋是——內(nèi)存地址變了。let
允許你改變內(nèi)存地址,const
則不允許。
const importantId = 489 importantId = 100 // TypeError: Assignment to constant variable
一起看看這到底發(fā)生了什么。
當(dāng)聲明importantId
時(shí),JS 引擎為其分配一個(gè)內(nèi)存地址,并存儲一個(gè)大小為 489 的值。切記,變量importantId
等于這個(gè)內(nèi)存地址。
圖10
當(dāng)把 100 賦值給importantId
時(shí),因?yàn)?100 是原始類型,此時(shí)會(huì)分配一個(gè)用來存儲 100 的內(nèi)存地址。然后 JS 嘗試將新的內(nèi)存地址賦值給importantId
,此時(shí)就會(huì)發(fā)生錯(cuò)誤。這是我們想要的結(jié)果,因?yàn)槲覀儾幌敫淖円粋€(gè)非常重要的 ID。
圖11
對于新手來說,由于不清楚“改變”的真是含義,在使用 const 聲明變量可能會(huì)有些困惑,所以他們默認(rèn)使用 let 來避免麻煩。
然而,這并不是推薦的做法。Google 在他們的 JavaScript 風(fēng)格指南中寫道:“使用 const 或 let 聲明所有變量。除非變量會(huì)被重新賦值,否則優(yōu)先使用 const。一定不要使用 var”。
他們沒有明確說明為什么要這樣做,但我認(rèn)為這樣做有以下好處:
看完上述內(nèi)容,是不是對javascript內(nèi)存模型的用法有進(jìn)一步的了解,如果還想學(xué)習(xí)更多內(nèi)容,歡迎關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。