你可能會(huì)用到的

• 堆內(nèi)存: 存儲(chǔ)引用類型值所在的空間
• 棧內(nèi)存: 存儲(chǔ)基本類型值和存儲(chǔ)代碼所在空間
• 函數(shù)上下文: JS每一個(gè)函數(shù)在執(zhí)行的時(shí)候都會(huì)創(chuàng)建一個(gè)執(zhí)行上下文

1. 堆內(nèi)存中的數(shù)字和字符串都是相等的

let a = {}, b='0', c=0; a[b] = 'marron'; a[c] = 'Mar' console.log(a[b]) // Mar

• 第一行代碼, a創(chuàng)建是一個(gè)對(duì)象,對(duì)象在JS中是引用類型,因此會(huì)創(chuàng)建一個(gè)堆內(nèi)存來(lái)存儲(chǔ)對(duì)象

// 堆: AAAFFF00 (此時(shí)里面是空的)

• 此時(shí)a的值實(shí)際上是指向這個(gè)堆的地址,即A = AAAFFF00
• 在執(zhí)行 a[b] = 'marron'時(shí),實(shí)際上會(huì)給堆內(nèi)存中鍵為’0’賦上值 ‘marron’

// 堆: AAAFFF00 '0': 'marron'

• 在執(zhí)行a[c] = 'Mar'時(shí),由于堆中字符串和數(shù)字默認(rèn)是相等的,此時(shí)堆內(nèi)存中實(shí)際的操作是:

// 堆: AAAFFF00 + '0': 'Mar'

• 因此最后輸出的回收’Mar’

2.對(duì)象作為值在堆內(nèi)存中都會(huì)隱式調(diào)用toString方法,變?yōu)樽址?/h2> let a = {},b = {n: '1'},c = {m: '2'} a[b] = 'marron' a[c] = 'Mar' console.log(a[b]); // 'Mar' // 在堆內(nèi)存中都是 { '[object object]': 'Mar' }

• 執(zhí)行a= {}時(shí),

// 堆: AAAFFF01

• 此時(shí) a = AAAFFF01
• 執(zhí)行a[b] = 'marron'
• 會(huì)先隱式調(diào)用b.toString(),然后將得到的結(jié)果存放到 堆AAAFFF01中

// 堆: AAAFFF01 '[Object Object]': 'marron'

• 執(zhí)行a[c] = 'Mar',同理

// 堆: AAAFFF01 '[Object Object]': 'Mar'

• 因此,最后會(huì)輸出 ‘Mar’

3. 閉包問(wèn)題

var test = (function(i){return function(){alert(i *= 2)} })(2) test(5)

3.1 需要了解的

函數(shù)上下文: JS中每一個(gè)函數(shù)在執(zhí)行的時(shí)候都會(huì)創(chuàng)建一個(gè)執(zhí)行上下文

堆內(nèi)存: JS中每一個(gè)引用類型的操作,都對(duì)應(yīng)一個(gè)堆內(nèi)存

3.2 解析

• var test = (function(i){...})(2),等號(hào)右邊是一個(gè)自執(zhí)行函數(shù).執(zhí)行函數(shù)的時(shí)候會(huì)創(chuàng)建一個(gè)執(zhí)行上下文

// 自執(zhí)行函數(shù)的執(zhí)行上下文 i = 2; return function(){}

• 遇到return function(){}中的function是一個(gè)引用類型,故會(huì)創(chuàng)建一個(gè)堆內(nèi)存

// 堆: AAAFFF00 "alert(i *=2)" ...

• 然后將堆內(nèi)存的地址返回,此時(shí)堆內(nèi)存的上一級(jí)作用域是自執(zhí)行函數(shù)的執(zhí)行上下文

// 自執(zhí)行函數(shù)的 執(zhí)行上下文 i = 2; return AAAFFF00

• 此時(shí)test的值是堆的內(nèi)存地址: test = AAAFFF00
• 之后遇到了 test(5),函數(shù)執(zhí)行會(huì)創(chuàng)建一個(gè)執(zhí)行上下文

// test(5)的 執(zhí)行上下文 -> 堆: AAAFFF11

• 然后順著地址去找到堆AAAFFF11,找到堆AAAFFF11之后,遇到函數(shù)代碼字符串. alert( i *= 2),

// test(5)的 執(zhí)行上下文 "alert( i*= 2)"

• 由于當(dāng)前堆中沒(méi)用i的值,會(huì)順著作用域鏈,往上級(jí)作用域?qū)ふ?找到了 自執(zhí)行函數(shù)的上下文.然后回彈出字符串 “4”,同時(shí)堆內(nèi)存中i的值被改成了4

• 完畢之后,由于test(5)的執(zhí)行上下文中沒(méi)用變量被引用,會(huì)根據(jù)JS的垃圾回收機(jī)制,進(jìn)行銷毀.

• 而自執(zhí)行函數(shù)的 執(zhí)行上下文中的變量i被堆AAAFFF11引用,會(huì)一直存在,因此形成了閉包.

4. 閉包小練手

var a = 0,b = 0; function A(a){A = function(b){alert(a + b++);};alert(a++) } A(1); A(2);

• 首先有個(gè)全局作用域

// global a = 0; b = 0; A = 堆: FFFAAA00 ctx:A(1) ctx:A(2)

• 執(zhí)行到A(1)時(shí)

// ctx: A(1) a(局部) = 1 A(全局) = 堆: FFFAAA01 alert(a++) // 會(huì)彈出'1',此時(shí)局部a = 2 // 由于a被堆: FFFAAA01 引用,因此結(jié)束時(shí), ctx: A(1)不會(huì)被清除,形成了閉包喲.

• A(1)執(zhí)行完畢,此時(shí)全局作用域

// global a = 0; b = 0; A = 堆: FFFAAA01 ctx: A(2) <-- 執(zhí)行到這一行

• A(2)開始執(zhí)行

// ctx: A(2) 傳入?yún)?shù)由b接收 a(ctx(A(1))) = 2; b(局部) = 2; alert(a + b++); // 彈出'4', 然后局部b = 3 // 完畢后,作用域銷毀 // 注: A此時(shí)執(zhí)行的是堆: AAAFFF01,堆并未消失

• 綜上所述,會(huì)彈出’1’,‘4’

說(shuō)明: 上面執(zhí)行了2次A函數(shù),且分別用到了a , b變量…但是在對(duì)a,b變量操作完成后.全局變量的a和b的值并未改變.這引出了閉包的第二個(gè)作用,保護(hù)全局變量.

總結(jié)

以上是生活随笔為你收集整理的javascript --- 堆栈内存与闭包的作用的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。