內存洩露是指一塊被分配的內存既不能使用，又不能回收，直到浏覽器進程結束。在C++中，因為是手動管理內存，內存洩露是經常出現的事情。而現在流行的C#和Java等語言采用了自動垃圾回收方法管理內存，正常使用的情況下幾乎不會發生內存洩露。浏覽器中也是采用自動垃圾回收方法管理內存，但由於浏覽器垃圾回收方法有bug，會產生內存洩露。
1、當頁面中元素被移除或替換時，若元素綁定的事件仍沒被移除，在IE中不會作出恰當處理，此時要先手工移除事件，不然會存在內存洩露。
復制代碼 代碼如下:
<div id="myDiv">
<input type="button" value="Click me" id="myBtn">
</div>
<script type="text/javascript">
var btn = document.getElementById("myBtn");
btn.onclick = function(){
document.getElementById("myDiv").innerHTML = "Processing...";
}
</script>
應改成下面
復制代碼 代碼如下:
<div id="myDiv">
<input type="button" value="Click me" id="myBtn">
</div>
<script type="text/javascript">
var btn = document.getElementById("myBtn");
btn.onclick = function(){
btn.onclick = null;
document.getElementById("myDiv").innerHTML = "Processing...";
}
</script>
或者采用事件委托
復制代碼 代碼如下:
<div id="myDiv">
<input type="button" value="Click me" id="myBtn">
</div>
<script type="text/javascript">
document.onclick = function(event){
event = event || window.event;
if(event.target.id == "myBtn"){
document.getElementById("myDiv").innerHTML = "Processing...";
}
}
</script>
2、
復制代碼 代碼如下:
var a=document.getElementById("#xx");
var b=document.getElementById("#xxx");
a.r=b;
b.r=a;
復制代碼 代碼如下:
var a=document.getElementById("#xx");
a.r=a;
對於純粹的 ECMAScript 對象而言，只要沒有其他對象引用對象 a、b，也就是說它們只是相互之間的引用，那麼仍然會被垃圾收集系統識別並處理。但是，在 Internet Explorer 中，如果循環引用中的任何對象是 DOM 節點或者 ActiveX 對象，垃圾收集系統則不會發現它們之間的循環關系與系統中的其他對象是隔離的並釋放它們。最終它們將被保留在內存中，直到浏覽器關閉。
3、
復制代碼 代碼如下:
var elem = document.getElementById('test');
elem.addEventListener('click', function() {
alert('You clicked ' + elem.tagName);
});
這段代碼把一個匿名函數注冊為一個DOM結點的click事件處理函數，函數內引用了一個DOM對象elem，就形成了閉包。這就會產生一個循環引用，即：DOM->閉包->DOM->閉包...DOM對象在閉包釋放之前不會被釋放；而閉包作為DOM對象的事件處理函數存在，所以在DOM對象釋放前閉包不會釋放，即使DOM對象在DOM tree中刪除，由於這個循環引用的存在，DOM對象和閉包都不會被釋放。可以用下面的方法可以避免這種內存洩露
復制代碼 代碼如下:
var elem = document.getElementById('test');
elem.addEventListener('click', function() {
alert('You clicked ' + this.tagName); // 不再直接引用elem變量
});
4、
復制代碼 代碼如下:
function bindEvent()
{
var obj=document.createElement("XXX");
obj.onclick=function(){
//Even if it's a empty function
}
}
閉包非常容易構成循環引用。如果一個構成閉包的函數對象被指定給，比如一個 DOM 節點的事件處理器，而對該節點的引用又被指定給函數對象作用域中的一個活動（或可變）對象，那麼就存在一個循環引用。
DOM_Node.onevent -<function_object.[[scope]] -<scope_chain -<Activation_object.nodeRef -<DOM_Node。
形成這樣一個循環引用是輕而易舉的，而且稍微浏覽一下包含類似循環引用代碼的網站（通常會出現在網站的每個頁面中），就會消耗大量（甚至全部）系統內存。
解決之道，將事件處理函數定義在外部，解除閉包
復制代碼 代碼如下:
function bindEvent()
{
var obj=document.createElement("XXX");
obj.onclick=onclickHandler;
}
function onclickHandler(){
//do something
}
或者在定義事件處理函數的外部函數中，刪除對dom的引用（題外，《JavaScript權威指南》中介紹過，閉包中，作用域中沒用的屬性可以刪除，以減少內存消耗。）
復制代碼 代碼如下:
function bindEvent()
{
var obj=document.createElement("XXX");
obj.onclick=function(){
//Even if it's a empty function
}
obj=null;
}
5、
復制代碼 代碼如下:
a = {p: {x: 1}};
b = a.p;
delete a.p;
執行這段代碼之後b.x的值依然是1.由於已經刪除的屬性引用依然存在，因此在JavaScript的某些實現中，可能因為這種不嚴謹的代碼而造成內存洩露。所以在銷毀對象的時候，要遍歷屬性中屬性，依次刪除。
6. 自動類型裝箱轉換
別不相信，下面的代碼在ie系列中會導致內存洩露
復制代碼 代碼如下:
var s=”lalala”;
alert(s.length);
s本身是一個string而非object，它沒有length屬性，所以當訪問length時，JS引擎會自動創建一個臨時String對象封裝s，而這個對象一定會洩露。這個bug匪夷所思，所幸解決起來相當容易，記得所有值類型做.運算之前先顯式轉換一下：
復制代碼 代碼如下:
var s="lalala";
alert(new String(s).length);
7、某些DOM操作
IE系列的特有問題 簡單的來說就是在向不在DOM樹上的DOM元素appendChild；IE7中，貌似為了改善內存洩露，IE7采用了極端的解決方案：離開頁面時回收所有DOM樹上的元素，其它一概不管。