JavaScript對內存的運用

內存的分派(表示)

啟動遞次,就需要分派內存給運轉的遞次。啟動瀏覽器,就會分派肯定內存供瀏覽器運用,瀏覽器在會分派響應的內存供諸如HTML+CSS,JS,’HTTP’,’其他插件、定時器`等模塊運用,如下圖。
《JavaScript對內存的運用》

會有一部分內存供JS模塊運用,JS平常會將JS代碼存儲在代碼區,數據區內,經由過程某種聯絡將代碼和數據對應在一起,如下圖。
《JavaScript對內存的運用》

內存圖

表示圖

內存圖就是簡化模仿表示JS運用的內存中的數據區中的狀況,簡樸的分為棧內存Stack,堆內存Heap,如下圖。顯著,左側是原始代碼,中心是棧內存,右側是堆內存
《JavaScript對內存的運用》

運用

左側原始代碼定義一個變量,在棧內存中就會用64位存儲一個值。假如原始代碼中變量是非對象棧內存中這個值就是直接值堆內存沒有數據。假如原始代碼中變量是對象棧內存中就會存儲堆內存的地點(隨機),堆內存中會存儲這個對象的一切內容
《JavaScript對內存的運用》

看到上個圖,原始代碼區里末了一行O2=O,將一個對象賦值給另一個變量時,現實上是將堆內存的地點賦值給另一個變量,轉換如下圖,O2在棧內存中的內容就變成了和O一樣的堆內存地點
《JavaScript對內存的運用》

運用實例

第一個

  • 原始代碼中定義變量a=1,Stack中存儲1
  • 原始代碼中定義變量b=a,Stack中存儲b的值和a一樣,為1
  • 原始代碼中賦值b=2,都黑白對象,Stack中直接將b的值改成2,不影響a
  • 全程非對象,所以沒有觸及堆內存Heap

《JavaScript對內存的運用》

第二個

  • 原始代碼中定義變量a={name:'a'},是個對象,隨機分派Heap地點(比方:31)並在Heap中存儲這個對象,在Stack中存儲這個Heap地點,比方ADDR 31
  • 原始代碼中定義變量b=a,是個存在的對象,將a的Stack值(ADDR 31)(Heap地點)賦給b的Stack值
  • 原始代碼中賦值b=null,賦給了b一個非對象,將b的Stack值改成null,不影響a
  • 全程操縱Stack值,對象的Stack值為Heap地點

《JavaScript對內存的運用》

第三個

  • 原始代碼定義變量a={n:1},隨機分派Heap地點(比方:34)並在Heap中存儲這個對象,在Stack中存儲這個Heap地點,比方ADDR 34
  • 原始代碼中定義變量b=a,是個存在的對象,將a的Stack值(ADDR 34)(Heap地點)賦給b的Stack值
  • a.x=a={n:2},這句話瀏覽遞次從左往右。起首,在Heap 34中增加新屬性x:a,如今a的值是ADDR 34,所以新屬性相當於x:ADDR 34。然後,把{n:2}賦值給a,由於是個新對象,所以重新分派Heap地點(ADDR 54),並把a的Stack值變更為新的Heap地點(ADDR 51)。
  • alert(a.x),如今a的值現實是ADDR 54ADDR 54內里是沒有x這個屬性的,所以返回undefined
  • alert(b.x),b一直是ADDR 34,个中x屬性值為ADDR 54,所以是個對象,返回[object Object]
  • 總之就是,原始代碼里對對象的操縱都在堆內存Heap中完成,對變量的操縱都在棧內存Stack中完成。非對象的Stack值就是直接值,對象的Stack值是堆內存Heap的地點

《JavaScript對內存的運用》

第四個

  • 原始代碼中定義變量a={name:'a'},Heap中存儲對象,Stack中存儲Heap地點(ADDR 101)
  • 原始代碼b=a,把a的Stack值(Heap地點)賦給b的Stack值
  • 原始代碼b={'name':'b'},賦給b一個新對象,Heap中存儲新對象,b的Stack值變更為新的Heap地點(ADDR 301)
  • 所以,a.name沒有變,照樣a

《JavaScript對內存的運用》

第五個

  • 原始代碼中定義變量a={name:'a'},Heap中存儲對象,Stack中存儲Heap地點(ADDR 51)
  • 原始代碼b=a,把a的Stack值(Heap地點)賦給b的Stack值
  • 原始代碼設置b.name=b,就是ADDR 51中的name值變更為b
  • 所以,a.name也就是ADDR 51中的name值,即是b
  • 這裏,a和b的Stack值都指向統一Heap地點ADDR 51,所以不管對誰人舉行操縱,都是對一個東西做操縱,所以會相互影響

《JavaScript對內存的運用》

    原文作者:BreezingSummer
    原文地址: https://segmentfault.com/a/1190000015188561
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞