2008年4月23日星期三

闭包函数导到 IE 内存泄漏



闭包函数是一个内部的函数,可以理解为函数里的函数,如下面代码一中的 ClickEventHandler 函数

如果闭包函数引用了外部变量,那么,闭包函数运行完毕后,可能并不会释放该变量,于是会导致内存泄漏



代码一:



<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"));

}



function BreakLeak()

{

}

</script>

</head>

<body onload="SetupLeak()" onunload="BreakLeak()">

<div id="LeakedDiv"></div>

</body>

</html>





解决方法就是将闭包函数先放入一个变量,这样,当它执行完成后,它仍然在内存中存在,然后再显式地释放它,如代码二:



<html>

<head>

<script language="JScript">



function AttachEvents(element)

{

// In order to remove this we need to put

// it somewhere. Creates another ref

element.expandoClick = ClickEventHandler;



// This structure causes element to ref ClickEventHandler

element.attachEvent("onclick", element.expandoClick);



function ClickEventHandler()

{

// This closure refs element

}

}



function SetupLeak()

{

// The leak happens all at once

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

}



//释放内存

function BreakLeak()

{

document.getElementById("LeakedDiv").detachEvent("onclick",

document.getElementById("LeakedDiv").expandoClick);

document.getElementById("LeakedDiv").expandoClick = null;

}

</script>

</head>

<body onload="SetupLeak()" onunload="BreakLeak()">

<div id="LeakedDiv"></div>

</body>

</html>

没有评论: