1. 程式人生 > >淺析JS中的堆內存與棧內存

淺析JS中的堆內存與棧內存

png ror 原因 不知道 mage 再看 tro 這也 怎麽

最近跟著組裏的大佬面試碰到這麽一個問題,

Q:說說var、let、const的區別
A:balabalabalabla...
Q:const定義的值能改麽?
A:你逗我?不能吧

不知道各位看官怎麽想?答案是部分能改,部分不能改。const定義的基本類型不能改變,但是定義的對象是可以通過修改對象屬性等方法來改變的。如,

>>> const a = 1
>>> a
<<< 1
>>> a = 2
<<< VM1750:1 Uncaught TypeError: Assignment to constant variable.
    at <anonymous>:1:3
    (anonymous) @ VM1750:1
>>> const b = {}
>>> b
<<< {}
>>> b.name = 1
>>> b
<<< {name: 1}
>>> b = {}
<<< VM1785:1 Uncaught TypeError: Assignment to constant variable.
    at <anonymous>:1:4

const不是定義常量麽?為什麽還能改?這就是我們今天要說的重點~

js中的堆內存與棧內存

在js引擎中對變量的存儲主要有兩種位置,堆內存和棧內存

和java中對內存的處理類似,棧內存主要用於存儲各種基本類型的變量,包括Boolean、Number、String、Undefined、Null,**以及對象變量的指針,這時候棧內存給人的感覺就像一個線性排列的空間,每個小單元大小基本相等。

而堆內存主要負責像對象Object這種變量類型的存儲,如下圖
技術分享圖片

棧內存中的變量一般都是已知大小或者有範圍上限的,算作一種簡單存儲。而堆內存存儲的對象類型數據對於大小這方面,一般都是未知的。個人認為,這也是為什麽null作為一個object類型的變量卻存儲在棧內存中的原因。

因此當我們定義一個const對象的時候,我們說的常量其實是指針,就是const對象對應的堆內存指向是不變的,但是堆內存中的數據本身的大小或者屬性是可變的。而對於const定義的基礎變量而言,這個值就相當於const對象的指針,是不可變。

既然知道了const在內存中的存儲,那麽const、let定義的變量不能二次定義的流程也就比較容易猜出來了,每次使用const或者let去初始化一個變量的時候,會首先遍歷當前的內存棧,看看有沒有重名變量,有的話就返回錯誤。

說到這裏,有一個十分很容易忽略的點,之前也是自己一直沒有註意的就是,使用new關鍵字初始化的之後是不存儲在棧內存中的。為什麽呢?new大家都知道,根據構造函數生成新實例,這個時候生成的是對象

,而不是基本類型。再看一個例子

var a = new String('123')
var b = String('123')
var c = '123'
console.log(a==b, a===b, b==c, b===c, a==c, a===c)  
>>> true false true true true false
console.log(typeof a)
>>> 'object'

我們可以看到new一個String,出來的是對象,而直接字面量賦值和工廠模式出來的都是字符串。但是根據我們上面的分析大小相對固定可預期的即便是對象也可以存儲在棧內存的,比如null,為啥這個不是呢?再繼續看

var a = new String('123')
var b = new String('123')
console.log(a==b, a===b)
>>> false false

很明顯,如果a,b是存儲在棧內存中的話,兩者應該是明顯相等的,就像null === null是true一樣,但結果兩者並不相等,說明兩者都是存儲在堆內存中的,指針指向不一致。

說到這裏,再去想一想我們常說的值類型和引用類型其實說的就是棧內存變量和堆內存變量,再想想值傳遞和引用傳遞、深拷貝和淺拷貝,都是圍繞堆棧內存展開的,一個是處理值,一個是處理指針。

內存分配和垃圾回收

一般來說棧內存線性有序存儲,容量小,系統分配效率高。而堆內存首先要在堆內存新分配存儲區域,之後又要把指針存儲到棧內存中,效率相對就要低一些了。
垃圾回收方面,棧內存變量基本上用完就回收了,而推內存中的變量因為存在很多不確定的引用,只有當所有調用的變量全部銷毀之後才能回收。

繼續往下思考的話,其中還有很多的東西需要去學習,今天先到這裏,後續再來補充。

話說~NaN會不會也是存儲在堆內存中的呢?大家想想吧,歡迎大家來一起討論討論~文中如有錯誤歡迎指出~

淺析JS中的堆內存與棧內存