不理解闭包和事件绑定内存泄露问题，有代码，右图，欢迎进来

HPhone 2011-12-21 12:04:02

[b]我不明白他的那个图到底是什么意思？怎么搞的作用域循环引用/b]

如果看不清图片的话，网页源地址：http://www.update8.com/Web/Javascript/11137_4.html

< html > 

     < head > 

         < script language = “ JScript “ > function  AttachEvents(element)

        {

             //  This structure causes element to ref ClickEventHandler  

            element.attachEvent( “ onclick “ , ClickEventHandler); function  ClickEventHandler()

            {

                 //  This closure refs element    

            }

        } function  SetupLeak()

        {

             //  The leak happens all at once 

            AttachEvents(document.getElementById( “ LeakedDiv “ ));

        } </ script > 

     </ head > < body onload = “ SetupLeak() “   > 

         < div id = “ LeakedDiv “ ></ div > 

     </ body > 

</ html >

闭包的一个内部方法赋给了element对象，产生了一个作用域的循环引用，从而造成内存泄露。其原理图如下：

解决方案如下，在确定事件不再使用后，解除事件的绑定：



function BreakLeak() { document.getElementById(”LeakedDiv”).detachEvent(”onclick”, document.getElementById(”LeakedDiv”).expandoClick);  document.getElementById(”LeakedDiv”).expandoClick = null; }

通常情况下，常用的js框架都帮我们解决了这个问题，不需要我们自己处理，这也是使用框架的一个好处。

...全文

155 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

南老頭 2011-12-21

打赏
举报

木看到图片

峭沙 2011-12-21

打赏
举报

这张图应该是说函数AttachEvents包含一个dom的引用——document.getElementById( “ LeakedDiv “ )，而document.getElementById( “ LeakedDiv “ )这个dom元素又同时保持有AttachEvents函数的子函数ClickEventHandler的引用，这样就构成js对象(函数对象)和Native Object(dom对象)的循环引用，这种问题IE6处理不了，会造成内存泄露。
个人理解，仅供参考

峭沙 2011-12-21

打赏
举报

这张图应该是说函数AttachEvents——document.getElementById( “ LeakedDiv “ )，而document.getElementById( “ LeakedDiv “ )这个dom元素又同时保持有AttachEvents函数的子函数ClickEventHandler的引用，这样就构成js对象(函数对象)和Native Object(dom对象)的循环引用，这种问题IE6处理不了，会造成内存泄露。
个人理解，仅供参考

HPhone 2011-12-21