JavaScript closure detailed _javascript tips

Look at the online closure of the concept and article, for this problem, do a comb yourself.

Q: What is a closure?
A: Closures mean that in JavaScript, internal functions can always access the arguments and variables declared in the external function in which they reside, even after their external functions have been returned (the end of life).

This is the first time I've ever run into a closure.

<! DOCTYPE html>
 
 

If you haven't used it before, it's also assumed that clicking a paragraph pops up the corresponding number 0,1,2,3,4 the paragraph. But actually are all pop 5;

There have been a lot of discussion blogs on the internet, and they have come up with a number of ways to implement the pop-up numbers.

Workaround 1: Save the variable I to a property of the corresponding paragraph

var pary = document.getElementsByTagName ("P"); 
for (var i=0; i< 5; i++) { 
pary[i].no = i; 
Pary[i].onclick = function () { 
alert (this.no); 
} 
};

Workaround 2: Add a layer closure, I pass the function parameter form to the inner layer function

var pary = document.getElementsByTagName ("P"); 
for (var i=0; i< 5; i++) { 
pary[i].no = i; 
Pary[i].onclick = function () { 
alert (this.no); 
} 
};

For this resulting closure problem, the online argument is that "variable i is stored in the function as a pointer or variable address"; Well, it's all about the pointer. Then explore it again.

Explore 1 and return all 10 instead of

(function test () { 
var temp =10; 
for (var i=0; i< 5; i++) { 
document.getElementById ("P" +i). Onclick=function () { 
alert (temp);// Access to the variable temp, closure} of the parent function
;
temp=20;
}) ();

Explore 2, return 10, and then return 20.

(function test () { 
var temp =10; 
for (var i=0 i< 5; i++) { 
document.getElementById ("P" +i). Onclick=function () { 
alert (temp);////access to the parent function's variable i, closure 
}
if (i===1) {
alert (temp);
}
};
temp=20;
}) ();

By exploring the 1, 2, we can conclude that the function internally accesses a variable of the same level as the function, then the variable is resident memory. Accessing the variable is essentially accessing the variable's address;

Then, and read a "JS closure in the This object" article, continue to discuss, this question.

JS closure This object 1
var name = ' The Window ';
var object = {
  name: ' My object ',
  getnamefunc1:function () {
    //return this.name;
    Console.log (this);//object return
    function () {//Closure, access is global variable, this refers to Windows
     Console.log (this); Windows return
     this.name//the Window
    }
  ,
  getnamefunc2:function () {return
     this.name;// Access is Object
  },
  aa:function () {
   alert;
  }
};
Alert (OBJECT.GETNAMEFUNC1 ());//pop-up "the Window"

Q: Then why does the anonymous function not get the This object that contains the scope?
A: Each function will automatically get two special variables when invoked: this and arguments. When an intrinsic function searches for these two variables, it directs the search to the active object, so it is never possible to directly access the two variables in the external function.
However, you can do this with the following code (direct access to variables in external functions):

JS closure This object 2
var name = ' The Window ';
var object = {
  name: ' My object ',
  getnamefunc:function () {
   var, = this;
   Console.log (this);//output is the object return
   function () {
    Console.log (this), or the output is still windows return
    that.name ;
   };
  }
};
Alert (Object.getnamefunc ());//pop-up "my Object"

The difference is that the this object is assigned to a that variable, which, even after the function returns, is still referencing the object, so it returns object.
Write so many closures of things, that also by the way the closure of God horse use it, otherwise, the closure of the pack is really a bad guy.

See examples of such a typical closure:

function A () {
 var a=1;
 function B () {return
  A;
 }; 
 return B;
};

var c=a ();//c obtains the provider
Console.log (C ()) of A's child scope B;//1 C can access the variable A in the parent scope of B 

As long as other scopes have access to the child scope, other scopes have methods to access the variables of the child scope's parent scope. In this way, if you need to access a function in the future, it is greatly useful.

These many of the above code is also online to find, I also just understand, see the process summed up.