内存图和垃圾回收机制

注意:内存图一到六栈和堆写反了,,应该是图七的样子。并且黑色和蓝色笔触有先后顺序
本篇文章用几道题和他们的内存图来解释下对象的引用,以及浏览器的垃圾回收机制.
下面有几句知识点需要记下来:

  • 所有的变量和对象之间都是引用关系。
  • 等于号只做一件事情,就是把右边的东西存到左边。
  • 如果一个对象没有被引用,他就是垃圾,将被回收。
  • 内存泄漏就是浏览器出了bug,本应该被标记为垃圾的,没有被标记,一直占着内存。

第一部分、例题:
1、求a是多少?

var a = 1
var b = a
    b = 2
    a = ?

内存图一:

image.png

解释:

  • 首先,a=1,接下来,把a的值赋值给b,就是把1存到b里,所以,b也对应了一个黑色的1。
  • 然后,把值2存到b里,所以,b现在是蓝色的2.
  • 最后得出结论,a的值还是1.

2、求a.name是多少?

var a = {name:'a'}
var b = a
    b = {'name':'b'}
    a.name = ?

内存图二:

image.png

解释:

  • 首先,a = {name:'a'},接下来,把a的值赋值给b,就是把{name:'a'}也存到b里,所以,b也对应了一个黑色的地址 address1,此时a和b都引用栈中的地址1。
  • 然后,把 {'name':'b'}存到b里,区别就在这,{'name':'b'}会先在栈里有一个地址address2,然后,把这个地址给b,所以,b的堆指向变为address2
  • 最后得出结论,a的name还是a.

3、求a.name是多少?

var a = {name:'a'}
var b = a
    b.name='b'
    a.name = ?

内存图三:

image.png

解释:

  • 首先,a = {name:'a'},接下来,把a的值赋值给b,就是把{name:'a'}也存到b里,所以,b也对应了一个黑色的地址 address1,此时a和b都引用栈中的地址1。
  • 然后,把 'b'赋值给b的name,而b的name就是栈中的地址1的name。
  • 最后得出结论,a的name是b.

4、求a = ?

var a = {name:'a'}
var b = a
    b=null
    a = ?

内存图四:

image.png

解释:

  • 首先,a = {name:'a'},接下来,把a的值赋值给b,就是把{name:'a'}也存到b里,所以,b也对应了一个黑色的地址 address1,此时a和b都引用栈中的地址1。
  • 然后,把 null赋值给b,null的类型虽然是object,但是还是属于基本类型,所以,直接写在堆里。
  • 最后得出结论,a= {name:'a'}
    5、
var a;
a = {self:a}
    a.self 即为undefined
a = {self:undefined}

解释:

  • 首先,self对应的a还未定义完毕,所以是undefined.

6、求a .self.self.self....?

var a = {}
a.self = a

内存图六:

image.png

解释:

  • 如图,

7、求a.x = ?b.x = ?

var a = {n:1}
var b = a
    a.x = a = {n:2}
    a.x = ?
    b.x = ?

内存图七:

image.png

解释:

  • 首先,a = {n:1},接下来,把a的值赋值给b,就是把{n:1}也存到b里,所以,b也对应了一个黑色的地址 address1,此时a和b都引用栈中的地址1。
  • 然后,浏览器从左向右读取,a.x = a,是指a有一个x等于a,接着又读到a = {n:2},所以,中间的a,是栈里面的地址2,但是最左的x,依然表示的address1,所以,栈里面的address1有一个x,值为address2.所以,最后的a即为address2.
  • a.x,由于a现在指向了address2,没有x,所以为undefined. b.x自然就为[object object]
    第二部分、垃圾回收:
    举例:
    1、
var a = {name:'a'}
var b = {name:'b'}
    a = b

内存图1:

image.png

解释:

  • 首先,a = {n:1},接下来,把a的值赋值给b,就是把{n:1}也存到b里,所以,b也对应了一个黑色的地址 address1,此时a和b都引用栈中的地址1。
    2、
var fn = function(){}
document.body.onclick = fn
fn = null

内存图2:

image.png

解释:

  • 但是如果关了页面document就不存在了,因此就变成了垃圾。
  • 在IE6中存在着内存泄漏的问题,就是浏览器出了bug,本该被标记为垃圾的没有被标记,就一直占据着内存。所以,解法为:
window.onunload = function(){
  document.body.onclick = null://这里代指事件,真正写的时候只要是有的事件都要设置为null。
}

画图不易,且看且珍惜,如果要转载请注明出处哦~~
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容