Dwell on javascript memory leaks _javascript tips

Source: Internet
Author: User
Tags garbage collection

1, what is closure, and closures involved in the scope of the chain here is not said.

2. JavaScript garbage collection mechanism

JavaScript does not need to manually free memory, it uses an automatic garbage collection mechanism (garbage collection). When an object is useless, that is, the object is not referenced in the program, the variable is released from memory.

Copy Code code as follows:

var s = [1, 2, 3];
var s = null;
So the original array [1, 2, 3] will be released.

3. Circular Reference

Three objects A, B, C

A property of a aàbàc:a refers to B, and C is also referenced by the properties of B. If you clear a, then B, C is also released.

Aàbàcàb: This adds a property of C to the reference B object, and if this is clear a, then B, C is not released, because a circular reference is generated between B and C.

Copy Code code as follows:

var a = {};
A.pro = {a:100};
A.pro.pro = {b:100};
A = null;
In this case, {a:100} and {b:100} are also freed.

var obj = {};
Obj.pro = {a:100};
Obj.pro.pro = {b:200};
var two = Obj.pro.pro;
obj = null;
In this case {b:200} will not be released, and {a:100} is freed.

4. Circular references and closures

Copy Code code as follows:

function outer () {
var obj = {};
function inner () {
The Obj object is referenced here
}
Obj.inner = inner;
}

This is a circular reference that is hidden from the other. When outer is invoked, the obj and inner two objects are created inside it, and the inner property of obj references inner; Also, the inner references obj, because obj is still in the Innerfun closed environment. This is precisely due to JavaScript-specific "scope chaining".
As a result, closures are very easy to create circular references, and fortunately JavaScript can handle this circular reference well.

5, IE in the memory leak

There are several types of memory leaks in IE, which are explained in detail (http://msdn.microsoft.com/en-us/library/bb250448.aspx).

Only one of these is discussed here, which is the memory leak caused by circular references, because this is one of the most common scenarios.

When there is a circular reference between a DOM element or an ActiveX object and a normal JavaScript object, IE has a particular difficulty releasing such variables, it is best to manually disconnect the circular reference, which has been fixed in IE 7 (http:// www.quirksmode.org/blog/archives/2006/04/ie_7_and_javasc.html).

"IE 6 suffered from memory leaks where a circular reference between several objects, among which at least one DOM node, is Created. This is problem has been solved in IE 7. ”

If obj in the above example (4th) references a JavaScript function object (inner) instead of an ActiveX object or DOM element, the circular reference formed in IE cannot be freed.

Copy Code code as follows:

function init () {
var elem = document.getElementById (' id ');
Elem.onclick = function () {
Alert (' Rain-man ');
This refers to the Elem element
};
}

Elem references its listener function for the Click event, which also refers back to the elem element through its scope chain. This will not release these circular references even if you leave the current page in IE.

6. Solution method

The basic approach is to manually clear this circular reference, and here is a very simple example where you can build a addevent () function on your own, and purge all event bindings on the Unload event of the window.

Copy Code code as follows:

function outer () {
var one = document.getElementById (' one ');
One.onclick = function () {};
}
Window.onunload = function () {
var one = document.getElementById (' one ');
One.onclick = null;
};

Other methods (By:douglas Crockford)

Copy Code code as follows:

/**
* Traverse an element node and all descendant elements
*
* @param the element node to be cleared by Elem node
* Functions that are processed @param function func
*
*/
function walkthedom (node, func) {
Func (node);
node = Node.firstchild;
while (node) {
Walkthedom (node, func);
node = node.nextsibling;
}
}
/**
* Clear all references to the DOM node to prevent memory leaks
*
* @param the element node to be cleared by Elem node
*
*/
function purgeeventhandlers (node) {
Walkthedom (node, function (e) {
for (var n in e) {
if (typeof e[n] = = =
' function ') {
E[N] = null;
}
}
});

The above is the JavaScript memory leak related content as well as the solution, the need for small partners can refer to the

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.