The Use of return in Javascript and Detailed Explanation of Closure

Preface

A closure in Javascript is an expression (usually a function) that has many variables and the environment in which they are bound, so these variables are part of the expression. The return statement plays an important role in js. This keyword not only has the function of returning function value, but also has some special usage. Let's take a look at the detailed introduction of the use and closure of return in Javascript.

1. Use of return

Case 1:

var a=1;

for(var b=0; b<10; b++){

 return b;

};

sonsole.log(b)// Returns null 

Personally, I think that the left and right here are global, and the code after return will not be executed;

Case 2:

var a=1;

function bb(){

 for(var b=0;b<10;b++){

 return b;

 };

};

console.log(bb);// Return 0

2. Chain scopes and closures

Look at a case first:

var a=1;
function f1(){
 var b=2;
 function f2(){
 console.log(a);//1
 console.log(b)//2
 };
};

Chained scope: In the above code, function f2 is included inside function f1, and all local variables inside f1 are visible to f2. But the reverse is not true. Local variables inside f2 are invisible to f1. This is the unique "chain scope" structure of Javascript language;

Closure: To put it bluntly, it is to use one way to realize the function of accessing local variables;

In Javascript language, only sub-functions within a function can read local variables, so closure can be simply understood as "a function defined within a function".

Therefore, in essence, a closure is a bridge connecting the inside and outside of a function.

function f1(){
 var a=1;
 function f2(){
 alert(a);
 };
 return f2
};

console.log(f1());//function f2(){alert(a);};
console.log(f1()());// Eject 1

So 1 can be written like this:

function f1(){
 var a=1;
 function f2(){
 alert(a);
 };
 return f2
};

var result=f1();
console.log(result());// Eject 1

Complete case of closure:

function f1(){

 n=999;

 function f2(){
  　  　  　  alert(n);
 　  }

   　  　  　   　  return f2;
}

var result=f1();

result(); // 999

You can now access the local variable n in f1 through f2, which is the closure.

Closure effect: One is to read the variables inside the function mentioned above, and the other is to keep the values of these variables in memory at all times.

function f1(){
 var a=222;
 f2=function(){// Note that this is written here, which is the same as using var Is a local variable, and if it is not applicable, it is a global variable 1 A truth; 
 alert(a);
 };

};


f1()// Empty 
f2()//222 Which can be accessed without closures 



function f1(){
 var a=222;
 function f2(){// Here is a function 
 alert(a);
 };
 nAdd=function(){a+=1};
 return f2
};

var obj=f1();
obj()//222

nAdd()// Empty 
obj();//223 While explaining the function f1 Local variables in a1 Save directly in memory, not in f1 Automatically cleared after calling 

Why is this happening? The reason is that f1 is the parent function of f2, and f2 is assigned a global variable, which leads to f2 always in memory, while the existence of f2 depends on f1, so f1 is always in memory and will not be collected by garbage collection mechanism (garbage collection) after the call.

Another notable point in this code is that " nAdd=function(){n+=1} "In this line 1, first of all, the var keyword is not used before nAdd, so nAdd is a global variable, not a local variable. Second, the value of nAdd is an anonymous function (anonymous function), and this

The anonymous function itself is also a closure, so nAdd is equivalent to an setter, which can operate on local variables inside the function outside the function.

Notices for using closures

1) Because closures will make the variables in the function are stored in memory, memory consumption is very large, so we can not abuse closures, otherwise it will cause performance problems of web pages, which may lead to memory leakage in IE. The solution is to delete all local variables that are not used before exiting the function.

2) Closures change the values of variables inside the parent function outside the parent function. So, if you use the parent function as an object (object), the closure as its public method (Public Method), and the internal variables as its private properties (private value), be careful not to casually

Summarize

The above is the whole content of this article. I hope the content of this article can bring 1 certain help to everyone's study or work. If you have any questions, you can leave a message for communication.