注意：内存图一到六栈和堆写反了，，应该是图七的样子。并且黑色和蓝色笔触有先后顺序
本篇文章用几道题和他们的内存图来解释下对象的引用，以及浏览器的垃圾回收机制.
下面有几句知识点需要记下来：
- 所有的变量和对象之间都是引用关系。
- 等于号只做一件事情，就是把右边的东西存到左边。
- 如果一个对象没有被引用，他就是垃圾，将被回收。
- 内存泄漏就是浏览器出了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。
}
画图不易，且看且珍惜，如果要转载请注明出处哦~~
网友评论