Understanding JavaScript Closures _javascript Tips

Source: Internet
Author: User
Tags closure garbage collection

What is a JavaScript closure?
JavaScript allows the use of intrinsic functions that can access all local variables, arguments, and other internal functions declared in the external function in which they reside. A closure is formed when one of these intrinsic functions is called outside the external function that contains them.
Examples of simple JavaScript closures:

<script>
  Function F1 () {
var n=999;
Nadd=function () {n+=1}
function F2 () {
alert (n);
return
F2;
var result=f1 ();
Result ();  999
nadd ();
Result (); 1000
</script>

In this piece of code, result is actually the closure F2 function. It runs two times, the first value is 999, and the second value is 1000. This proves that the local variable n in the function F1 is kept in memory and is not automatically purged after the F1 call.
Why is that? The reason is that F1 is the parent function of F2, and F2 is assigned to a global variable, which causes F2 to always be in memory, and the presence of F2 depends on F1, so F1 is always in memory and will not be reclaimed by the garbage collection mechanism (garbage collection) after the call has ended.
Another notable part of this code is the "Nadd=function () {n+=1}" line, which first nadd not use the var keyword, so nadd is a global variable, not a local variable. Second, the value of Nadd is an anonymous function (anonymous functions), and the anonymous function itself is a closure, so the nadd is equivalent to a setter that can manipulate local variables within the function outside of the function.
closure Applications:

var singleton = function () {
  var privatevariable;
  function Privatefunction (x) {
    ...} privatevariable ...
  }
 
  return {
    firstmethod:function (A, b) {
      ... privatevariable ...
    },
    secondmethod:function (c) {
      ...) Privatefunction () ...}}
();

This single piece is implemented by a closure. The encapsulation of private members and methods is done through closures. The anonymous main function returns an object. The object contains two methods, Method 1 can be a private variable, and Method 2 accesses the internal private function. The place to note is the ' () ' where the anonymous main function ends, without which a single piece cannot be produced. Because an anonymous function can only return a unique object and cannot be invoked elsewhere. This is the use of closures to produce a single piece of the method.

The advantages of closures :
(1) Do not add additional global variables,
(2) All variables in the execution process are within the anonymous function.
Disadvantages of closures :
(1) because the closure will make the function of the variables are stored in memory, memory consumption is very large, so can not abuse the closure, otherwise it will cause Web page performance problems, in IE may lead to memory leaks. The workaround is to remove all unused local variables before exiting the function.
(2) The closure will change the value of the internal variable of the parent function outside the parent function. So, if you use the parent function as an object, using the closure as its common method, and the internal variable as its private property (private value), be careful not to arbitrarily change the value of the internal variable of the parent function.

This article is for you to introduce here, if you are not familiar with JavaScript closures, please read the relevant articles to supplement learning, thank you for your reading.

Related Article

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.