【前端】这个js代码怎么内存泄漏了呢？？评论解析得越详细越好

请问，下面这段代码怎么导致内存泄漏了呢？？？各位大神评论解析得越详细越好。
是循环引用导致的，还是闭包导致的？

var user = {name: 'tom', age: 20, gender: 'male'}var test = document.getElementByid('test')
test.onclick = function() {
test.innerHTML = user.name;
}// ...后面还有很多其他操作，最后把user对象释放掉user = null;

还有，就是下面这样写为什么可以减少内存泄漏呢

var user = {name: 'tom', age: 20, gender: 'male'}var test = document.getElementByid('test')
(function (name) {
test.onclick = function() {
test.innerHTML = name;
}
})(user.name);
user = null;

回答

你第一段和第二段程序中引用发生的层级不同，一个是在函数体内用匿名函数完成引用（第一段），一个是在外层引用传值（第二段）。

第一段这个匿名函数一直绑定到onclick上，所以绑定不解除，买QQ账号地图引用就不解除，所以即使后面对象变量已经解除绑定了，但对象实体并不能被销毁回收内存（那块实体内存区域还有引用）。

第二段通过一个全局匿名即时调用函数，把user.name引用的具体字符串内容地址给了局部name变量，这个变量再被onclick引用绑定，而字符串的定义JS中是专门区域的，实际上user.name也仅仅是那个字符串区域的一个引用，所以实际上销毁user仅仅是对原来user.name所指区域进行一次减一次引用操作，而具体的区域并不会被回收，还可以被onclick引用绑定。

第一个里面，user一直被那个onclick指向的匿名函数引用，所以在user = null之后不会被回收
第二个里面，事件处理器里引用的是user.name的值，对user没有引用，所以可以在user = null之后被回收

JavaScript防止内存泄漏最有效的方法：少用对象、变量的引用赋值，建议了解下数据结构方面的知识。

更多相关文章

随机推荐