IE和webkit浏览器都是采用计数来处理垃圾,也就是说每个对象被引用一次,该对象的计数器成员+1,如果计数器为0,那么这个对象被销毁

 例如:

  1. function A() {
  2. var obj = {};
  3. }

运行A(); 对象obj在内存中,obj的计数为1,当A()运行完之后,A函数应该被销毁,A函数中的成员对象计数器需要-1,那么obj的计数器成员为0,obj对象被销毁。

  1. <script>
  2. var obj;
  3. function A(){
  4. obj = $('#id');
  5. $('#id').p = obj;
  6. }
  7. </script>

$('#id')与obj互相引用,运行A();obj不会被销毁,那么导致$('#id')也不会被销毁,导致内存泄漏。 因为$('#id').p的计数器用户不为0。

可能发生的场景

1.1闭包

看下面代码:

  1. function assignEvents(){
  2. var id = "xdi9592";
  3. document.getElementById("save-btn").onclick = function(event){
  4. saveDocument(id);
  5. }
    }

assignEvents函数为一个DOM元素指定了一个事件句柄,可是事件句柄是一个闭包,可以访问id变量。每次访问时都导致一些性能的损失。

1.2循环引用(包含dom对象和JS对象循环引用)

下面代码dom对象和JS对象循环引用导致内存泄漏。

  1. <html>
  2. <head>
  3. <script>
  4. function myFunction(element){
  5. this.elementReference = element;
  6. element.expandoProperty = this;
  7. }
  8. function Leak(){
  9. var obj = new myFunction(document.getElementById("myDiv"));
  10. }
  11. </script>
  12. </head>
  13. <body onload="Leak()">
  14. <div id = "myDiv"></div>
  15. </body>
  16. </html>

用谷歌调试器切换到Timeline,查看Memory的记录情况。

发现调用Leak()函数执行后,内存变大,可能内存已经泄漏。解决内存泄漏有一个办法就是设置对象为null,打破循环引用。

  1. function Leak(){
  2. var obj = new myFunction(document.getElementById("myDiv"));
  3. obj.element = null;
  4. }

查看Memory的记录情况:

内存已经降了下来。

在nodejs中很多源码都有相互引用的例子,例如nodejs源码lib/_http_server.js

  1. function connectionListener(socket) {
  2. // ...
  3. // 从 parsers 中取一个 parser
  4. var parser = parsers.alloc();
  5. parser.reinitialize(HTTPParser.REQUEST);
  6. //parser和socket相互引用
  7. parser.socket = socket;
  8. socket.parser = parser;
  9. // ...
  10. state.onData = socketOnData.bind(undefined, this, socket, parser, state);
  11. // ...
  12. socket.on('data', state.onData);
  13. // ...
  14. }

js内存泄漏的更多相关文章

  1. Chrome JS内存泄漏排查方法(Chrome Profiles)

     原文网址:http://blog.csdn.net/kaitiren/article/details/19974269 JS内存泄漏排查方法(Chrome Profiles)   Google Ch ...

  2. JS内存泄漏 和Chrome 内存分析工具简介(摘)

    原文地址:http://web.jobbole.com/88463/ JavaScript 中 4 种常见的内存泄露陷阱   原文:Sebastián Peyrott 译文:伯乐在线专栏作者 - AR ...

  3. JS内存泄漏排查方法——Chrome Profiles

    一.概述 Google Chrome浏览器提供了非常强大的JS调试工具,Heap Profiling便是其中一个.Heap Profiling可以记录当前的堆内存(heap)快照,并生成对象的描述文件 ...

  4. JS内存泄漏排查方法-Chrome Profiles

    原文链接:http://caibaojian.com/chrome-profiles.html 一.概述 Google Chrome浏览器提供了非常强大的JS调试工具,Heap Profiling便是 ...

  5. [转]JS内存泄漏排查方法(Chrome Profiles)

    Google Chrome浏览器提供了非常强大的JS调试工具,Heap Profiling便是其中一个.Heap Profiling可以记录当前的堆内存(heap)快照,并生成对象的描述文件,该描述文 ...

  6. 写出js内存泄漏的问题?

    回答一: (1)IE7/8 DOM对象或者Active对象循环引用导致内存泄漏 a.多个对象循环引用 b.循环的DOM泄漏 (2)基础的DOM泄漏 当原有的DOM被移除时,子节点引用没有被移除则无法回 ...

  7. js内存泄漏的问题?

    内存泄漏指任何对象在您不再拥有或需要它之后仍然存在. 垃圾回收器定期扫描对象,并计算引用了每个对象的其他对象的数量.如果一个对象的引用数量为 0(没有其他对象引用过该对象),或对该对象的惟一引用是循环 ...

  8. js 内存泄漏

    在javascript中,我们很少去关注内存的管理.我们创建变量,使用变量,浏览器关注这些底层的细节都显得很正常. 但是当应用程序变得越来越复杂并且ajax化之后,或者用户在一个页面停留过久,我们可能 ...

  9. Js内存泄漏的几种情况

    想解决内存泄露问题,必须知道什么是内存泄露,什么情况下出现内存泄露,才能在遇到问题时,逐个排除.这里只讨论那些不经意间的内存泄露. 一.什么是内存泄露 内存泄露是指一块被分配的内存既不能使用,又不能回 ...

随机推荐

  1. “Ceph浅析”系列之五——Ceph的工作原理及流程

    本文将对Ceph的工作原理和若干关键工作流程进行扼要介绍.如前所述,由于Ceph的功能实现本质上依托于RADOS,因而,此处的介绍事实上也是针对RADOS进行.对于上层的部分,特别是RADOS GW和 ...

  2. SpringMVC自定义视图 Excel视图和PDF视图

    一.自定义视图-Excel视图 1.Maven依赖 引入POI <dependency> <groupId>org.apache.poi</groupId> < ...

  3. java 枚举的常见使用方法

    JDK1.5引入了新的类型-枚举,枚举的出现在日常开发中带来了极大的方便. 常用方法一:常量 JDK1.5之前我们平时定义系统常量,基本都是用public static final ... 出现枚举以 ...

  4. FastDFS搭建及java整合代码【转】

    FastDFS软件介绍 1.什么是FastDFS FastDFS是用C语言编写的一款开源的分布式文件系统.FastDFS为互联网量身定制,充分考虑了冗余备份.负载均衡.线性扩容等机制,并注重高可用.高 ...

  5. 【转】c# 调用windows API(user32.dll)

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.R ...

  6. oracle 知识

    sqlplus /  as sysdba;  使用操作系统登录oracle数据库 conn panie/panie;  使用普通用户连接数据库 --开启归档模式shutdown immediate;s ...

  7. eclipse-debug时直接进入/不进入/提示进入调试页面修改

    eclipse使用debug调试程序时 默认设置每次程序走到断点位置时提示是否进入调试页面(如图) 而个人习惯有些系统直接进入调试页面.也有些人系统不进入调试页面调试 在这里勾选Remember my ...

  8. json2form实例

    <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  9. jquery插件-表单提交插件-jQuery.Form

    1.介绍 JQuery Form插件是一款强大的Ajax表单提交插件,可以简单方便的实现让我们的表单 由传统的提交方式转换成Ajax无刷新提交! 他提供了两个核心的方法ajaxForm以及ajaxSu ...

  10. Servlet与JSP版本历史以及Tomcat支持的版本

    查询这个的关键字:Java EE的版本历史. JavaServer Pages (JSP) Java Servlet 参考: https://en.wikipedia.org/wiki/Java_EE ...