JS常見內存泄漏及解決方案解析
內存泄漏?
官方解釋:內存泄漏(Memory Leak)是指程序中己動態(tài)分配的堆內存由于某種原因程序未釋放或無法釋放,造成系統(tǒng)內存的浪費,導致程序運行速度減慢甚至系統(tǒng)崩潰等嚴重后果。
通俗點就是指由于疏忽或者錯誤造成程序未能釋放已經不再使用的內存,不再用到的內存卻沒有及時釋放,從而造成內存上的浪費。
避免內存泄漏?
在局部作用域中,等函數(shù)執(zhí)行完畢,變量就沒有存在的必要了,垃圾回收機制很虧地做出判斷并且回收,但是對于全局變量,很難判斷什么時候不用這些變量,無法正?;厥眨凰?,盡量少使用全局變量。在使用閉包的時候,就會造成嚴重的內存泄漏,因為閉包中的局部變量,會一直保存在內存中。
內存溢出?
當程序運行需要的內存超過了剩余的內存時, 就出拋出內存溢出的錯誤。
例如下面的代碼,謹慎試用,可能會卡窗口。。。。
var obj = {} for (var i = 0; i < 100000; i++) { obj[i] = new Array(10000000) } console.log('------')
常見的js內存泄漏
1. 意外的全局變量
在js中,一個未聲明變量的使用,會在全局對象中創(chuàng)建一個新的變量;在瀏覽器環(huán)境下,全局對象就是window:
function foo() { a = 'test' } // 上面的寫法等價于 function foo() { window.a = 'test' }
function foo() { this.a = 'test' // 函數(shù)自身發(fā)生調用,this指向全局對象window } foo();
上面的a變量應該是foo()內部作用域變量的引用,由于沒有使用var來聲明這個變量,這時變量a就被創(chuàng)建成了全局變量,這個就是錯誤的,會導致內存泄漏。
解決方式: 在js文件開頭添加 ‘use strict',開啟嚴格模式。(或者一般將使用過后的全局變量設置為 null 或者將它重新賦值,這個會涉及的緩存的問題,需要注意)
<script> "use strict"; console.log("這是嚴格模式。"); </script> <script> console.log("這是正常模式。"); </script>
2. 計時器和回調函數(shù)timers
定時器setInterval或者setTimeout在不需要使用的時候,沒有被clear,導致定時器的回調函數(shù)及其內部依賴的變量都不能被回收,這就會造成內存泄漏。
解決方式:當不需要interval或者timeout的時候,調用clearInterval或者clearTimeout
3. DOM泄漏
1)給DOM對象添加的屬性是一個對象的引用
var a = {};
document.getElementById('id').diyProp = a;
解決方法:在window.onload時間中加上 document.getElementById('id').diyProp = null;
2)元素引用沒有清理
var a = document.getElementById('id');
document.body.removeChild(a);
// 不能回收,因為存在變量a對它的引用。雖然我們用removeChild移除了,但是還在對象里保存著#的引用,即DOM元素還在內存里面。
解決方法: a = null;
3)事件的綁定沒有移除
解決方法: 移除時間的監(jiān)聽
4. js閉包
閉包在IE6下會造成內存泄漏,但是現(xiàn)在已經無須考慮了。值得注意的是閉包本身不會造成內存泄漏,但閉包過多很容易導致內存泄漏。閉包會造成對象引用的生命周期脫離當前函數(shù)的上下文,如果閉包如果使用不當,可以導致環(huán)形引用(circular reference),類似于死鎖,只能避免,無法發(fā)生之后解決,即使有垃圾回收也還是會內存泄露。
這個,另外找個時間詳細說明一下,這里就不贅述了
5. console
控制臺日志記錄對總體內存內置文件的影響,也是個重大的問題,同時也是容易被忽略的。記錄錯誤的對象,可以將大量的數(shù)據(jù)保留在內存中。傳遞給console.log的對象是不能被垃圾回收,所以沒有去掉console.log可能會存在內存泄漏
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關文章
JS實現(xiàn)的倒計時恢復按鈕點擊功能【可用于協(xié)議閱讀倒計時】
這篇文章主要介紹了JS實現(xiàn)的倒計時恢復按鈕點擊功能,可用于協(xié)議閱讀倒計時,涉及javascript基于setInterval的時間定時觸發(fā)相關操作技巧,需要的朋友可以參考下2018-04-04JavaScript實現(xiàn)簡單獲取當前網頁網址的方法
這篇文章主要介紹了JavaScript實現(xiàn)簡單獲取當前網頁網址的方法,通過location對象的href方法來獲取網址,非常簡單實用,需要的朋友可以參考下2015-11-11