js内存泄露的几种情况详细探讨
字体：[ ] 类型：转载 时间：
内存泄露是指一块被分配的内存既不能使用，又不能回收，直到浏览器进程结束，由于浏览器垃圾回收方法有bug，会产生内存泄露，下面与大家详细探讨下内存泄露的几种情况
内存泄露是指一块被分配的内存既不能使用，又不能回收，直到浏览器进程结束。在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 = 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. if(event.target.id == "myBtn"){ document.getElementById("myDiv").innerHTML = "Processing..."; } } &/script&
代码如下: 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变量 });
代码如下: 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=onclickH } function onclickHandler(){ //do something }
或者在定义事件处理函数的外部函数中，删除对dom的引用（题外，《JavaScript权威指南》中介绍过，闭包中，作用域中没用的属性可以删除，以减少内存消耗。）
代码如下: function bindEvent() { var obj=document.createElement("XXX"); obj.onclick=function(){ //Even if it's a empty function } obj= }
代码如下: 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树上的元素，其它一概不管。
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具跟我学习javascript的垃圾回收机制与内存管理
作者：小平果118
字体：[ ] 类型：转载 时间：
跟我学习javascript的垃圾回收机制与内存管理，感兴趣的小伙伴们可以参考一下
一、垃圾回收机制—GC
Javascript具有自动垃圾回收机制(GC:Garbage Collecation)，也就是说，执行环境会负责管理代码执行过程中使用的内存。
原理：垃圾收集器会定期（周期性）找出那些不在继续使用的变量，然后释放其内存。
JavaScript垃圾回收的机制很简单：找出不再使用的变量，然后释放掉其占用的内存，但是这个过程不是实时的，因为其开销比较大，所以垃圾回收器会按照固定的时间间隔周期性的执行。
不再使用的变量也就是生命周期结束的变量，当然只可能是局部变量，全局变量的生命周期直至浏览器卸载页面才会结束。局部变量只在函数的执行过程中存在，而在这个过程中会为局部变量在栈或堆上分配相应的空间，以存储它们的值，然后在函数中使用这些变量，直至函数结束，而闭包中由于内部函数的原因，外部函数并不能算是结束。
还是上代码说明吧：
function fn1() {
var obj = {name: 'hanzichi', age: 10};
function fn2() {
var obj = {name:'hanzichi', age: 10};
var a = fn1();
var b = fn2();
我们来看代码是如何执行的。首先定义了两个function，分别叫做fn1和fn2，当fn1被调用时，进入fn1的环境，会开辟一块内存存放对象{name: 'hanzichi', age: 10}，而当调用结束后，出了fn1的环境，那么该块内存会被js引擎中的垃圾回收器自动释放；在fn2被调用的过程中，返回的对象被全局变量b所指向，所以该块内存并不会被释放。
这里问题就出现了：到底哪个变量是没有用的？所以垃圾收集器必须跟踪到底哪个变量没用，对于不再有用的变量打上标记，以备将来收回其内存。用于标记的无用变量的策略可能因实现而有所区别，通常情况下有两种实现方式：标记清除和引用计数。引用计数不太常用，标记清除较为常用。
二、标记清除
js中最常用的垃圾回收方式就是标记清除。当变量进入环境时，例如，在函数中声明一个变量，就将这个变量标记为“进入环境”。从逻辑上讲，永远不能释放进入环境的变量所占用的内存，因为只要执行流进入相应的环境，就可能会用到它们。而当变量离开环境时，则将其标记为“离开环境”。
function test(){
var a = 10 ; //被标记 ，进入环境
var b = 20 ; //被标记 ，进入环境
test(); //执行完毕 之后 a、b又被标离开环境，被回收。
　　垃圾回收器在运行的时候会给存储在内存中的所有变量都加上标记（当然，可以使用任何标记方式）。然后，它会去掉环境中的变量以及被环境中的变量引用的变量的标记（闭包）。而在此之后再被加上标记的变量将被视为准备删除的变量，原因是环境中的变量已经无法访问到这些变量了。最后，垃圾回收器完成内存清除工作，销毁那些带标记的值并回收它们所占用的内存空间。
　　到目前为止，IE、Firefox、Opera、Chrome、Safari的js实现使用的都是标记清除的垃圾回收策略或类似的策略，只不过垃圾收集的时间间隔互不相同。
三、引用计数
　　引用计数的含义是跟踪记录每个值被引用的次数。当声明了一个变量并将一个引用类型值赋给该变量时，则这个值的引用次数就是1。如果同一个值又被赋给另一个变量，则该值的引用次数加1。相反，如果包含对这个值引用的变量又取得了另外一个值，则这个值的引用次数减1。当这个值的引用次数变成0时，则说明没有办法再访问这个值了，因而就可以将其占用的内存空间回收回来。这样，当垃圾回收器下次再运行时，它就会释放那些引用次数为0的值所占用的内存。
function test(){
var a = {} ; //a的引用次数为0
var b = //a的引用次数加1，为1
var c =a; //a的引用次数再加1，为2
var b ={}; //a的引用次数减1，为1
　　Netscape Navigator3是最早使用引用计数策略的浏览器，但很快它就遇到一个严重的问题：循环引用。循环引用指的是对象A中包含一个指向对象B的指针，而对象B中也包含一个指向对象A的引用。
function fn() {
var a = {};
var b = {};
　　以上代码a和b的引用次数都是2，fn()执行完毕后，两个对象都已经离开环境，在标记清除方式下是没有问题的，但是在引用计数策略下，因为a和b的引用次数不为0，所以不会被垃圾回收器回收内存，如果fn函数被大量调用，就会造成内存泄露。在IE7与IE8上，内存直线上升。
我们知道，IE中有一部分对象并不是原生js对象。例如，其内存泄露DOM和BOM中的对象就是使用C++以COM对象的形式实现的，而COM对象的垃圾回收机制采用的就是引用计数策略。因此，即使IE的js引擎采用标记清除策略来实现，但js访问的COM对象依然是基于引用计数策略的。换句话说，只要在IE中涉及COM对象，就会存在循环引用的问题。
var element = document.getElementById("some_element");
var myObject = new Object();
myObject.e =
element.o = myO
　　这个例子在一个DOM元素（element)与一个原生js对象（myObject)之间创建了循环引用。其中，变量myObject有一个名为element的属性指向element对象；而变量element也有一个属性名为o回指myObject。由于存在这个循环引用，即使例子中的DOM从页面中移除，它也永远不会被回收。
看上面的例子，有同学回觉得太弱了，谁会做这样无聊的事情，其实我们是不是就在做
window.onload=function outerFunction(){
var obj = document.getElementById("element");
obj.onclick=function innerFunction(){};
这段代码看起来没什么问题，但是obj引用了document.getElementById(“element”)，而document.getElementById(“element”)的onclick方法会引用外部环境中德变量，自然也包括obj，是不是很隐蔽啊。
最简单的方式就是自己手工解除循环引用，比如刚才的函数可以这样
myObject.element =
element.o =
window.onload=function outerFunction(){
var obj = document.getElementById("element");
obj.onclick=function innerFunction(){};
将变量设置为null意味着切断变量与它此前引用的值之间的连接。当垃圾回收器下次运行时，就会删除这些值并回收它们占用的内存。
要注意的是，IE9+并不存在循环引用导致Dom内存泄露问题，可能是微软做了优化，或者Dom的回收方式已经改变
四、内存管理
1、什么时候触发垃圾回收？
垃圾回收器周期性运行，如果分配的内存非常多，那么回收工作也会很艰巨，确定垃圾回收时间间隔就变成了一个值得思考的问题。IE6的垃圾回收是根据内存分配量运行的，当环境中存在256个变量、4096个对象、64k的字符串任意一种情况的时候就会触发垃圾回收器工作，看起来很科学，不用按一段时间就调用一次，有时候会没必要，这样按需调用不是很好吗？但是如果环境中就是有这么多变量等一直存在，现在脚本如此复杂，很正常，那么结果就是垃圾回收器一直在工作，这样浏览器就没法儿玩儿了。
微软在IE7中做了调整，触发条件不再是固定的，而是动态修改的，初始值和IE6相同，如果垃圾回收器回收的内存分配量低于程序占用内存的15%，说明大部分内存不可被回收，设的垃圾回收触发条件过于敏感，这时候把临街条件翻倍，如果回收的内存高于85%，说明大部分内存早就该清理了，这时候把触发条件置回。这样就使垃圾回收工作职能了很多
2、合理的GC方案
1）、Javascript引擎基础GC方案是（simple GC）：mark and sweep（标记清除），即：
（1）遍历所有可访问的对象。
（2）回收已不可访问的对象。
2）、GC的缺陷
和其他语言一样，javascript的GC策略也无法避免一个问题：GC时，停止响应其他操作，这是为了安全考虑。而Javascript的GC在100ms甚至以上，对一般的应用还好，但对于JS游戏，动画对连贯性要求比较高的应用，就麻烦了。这就是新引擎需要优化的点：避免GC造成的长时间停止响应。
3）、GC优化策略
David大叔主要介绍了2个优化方案，而这也是最主要的2个优化方案了：
（1）分代回收（Generation GC）
这个和Java回收策略思想是一致的。目的是通过区分“临时”与“持久”对象；多回收“临时对象”区（young generation），少回收“持久对象”区（tenured generation），减少每次需遍历的对象，从而减少每次GC的耗时。如图：
这里需要补充的是：对于tenured generation对象，有额外的开销：把它从young generation迁移到tenured generation，另外，如果被引用了，那引用的指向也需要修改。
（2）增量GC
这个方案的思想很简单，就是“每次处理一点，下次再处理一点，如此类推”。如图：
这种方案，虽然耗时短，但中断较多，带来了上下文切换频繁的问题。
因为每种方案都其适用场景和缺点，因此在实际应用中，会根据实际情况选择方案。
比如：低 (对象/s) 比率时，中断执行GC的频率，simple GC更低些；如果大量对象都是长期“存活”，则分代处理优势也不大。
以上就是关于javascript的垃圾回收机制与内存管理的全部内容，希望对大家的学习有所帮助。
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具js的内存泄露问题， 哪些常见的情况会造成泄露？ - 知乎7被浏览674分享邀请回答24 条评论分享收藏感谢收起JS清除IE浏览器缓存的方法
字体：[ ] 类型：转载 时间：
本文为大家详细介绍下js中自动清除ie缓存的几种方法，大家可以根据自己的需求自由选择适合自己的，希望对大家学习js有所帮助
js中自动清除ie缓存方法 — 常用 对于动态文件,比如 index.asp?id=... 或者 index.aspx?id=... 相信有经验的程序员都知道怎样禁止浏览器缓存数据了. 但是对于静态文件(css,jpg,gif等等), 在什么场合下面我们需要禁止浏览器缓存他们,怎么做? 方法一：Dojo中我们可以用简单的方法完成：在dojo.xhrGet(包括post)等方法中都包含preventCache属性，此属性的含义： “默认为启用浏览器缓存，否则将通过自动增加不同的参数来确保浏览器缓存失效” 我们只要把此属性赋值为：“true”即可。 方法二：document.write(" 其中 ver=113 的 113就是版本号，一般都是采用 CVS 或其他工具生成的开发版本号。 这样真正做到了应该缓存的时候缓存静态文件，当版本有更新的时候从获取最新的版本，并更新缓存。 对于图像 来有效利用和更新缓存. js清除浏览器缓存 二 为了减小浏览器与服务器之间网络传输压力，往往对静态文件，如js,css,修饰的图片做cache，也就是给这些文件的HTTP响应头加入 Expires和Cache-Control参数，并指定缓存时间，这样一定时间内浏览器就不会给服务器发出任何的HTTP请求(除了强制刷新)，即使在 这段时间内服务器的js或css或图片文件已经更新多次，但浏览器的数据依然是原来最能初cache的旧数据，有没有办法让浏览器拿到已经修改后的最新数 据呢? 有，方法是用ajax请求服务器最新文件，并加上请求头If-Modified-Since和Cache-Control,如下:
代码如下: $.ajax({ type: "GET", url: "static/cache.js", dataType: "text", beforeSend :function(xmlHttp){ xmlHttp.setRequestHeader("If-Modified-Since","0"); xmlHttp.setRequestHeader("Cache-Control","no-cache"); } });
这里用了jquery. 这样浏览器就会把最新的文件替换掉本地旧文件。 当然，这里还一个问题就是js必须知道服务器更新了那个js、css、图片，利用cookie和时间版本应该可以解决. jquery自从1.2开始就有ifModified和cache参数了，不用自己加header ifModified Boolean Default: false Allow the request to be successful only if the response has changed since the last request. This is done by checking the Last-Modified header. Default value is false, ignoring the header. cache Boolean Default: true Added in jQuery 1.2, if set to false it will force the pages that you request to not be cached by the browser.
代码如下: $.ajax({ type: "GET", url: "static/cache.js", dataType: "text", cache:false, ifModified :true });
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具}