Interview review - closure

---

One 、 What is a closure ？

First , We need to define the concept of closure , The concept of Baidu Encyclopedia is quoted here

Closures are functions that can read internal variables of other functions . For example, in javascript in , Only subfunctions inside a function can read local variables , So closures can be understood as “ A function defined inside a function “. In essence , Closures are bridges that connect functions inside and outside .
[1]

In short , Is the function wrapped in the function , Form a closed loop , The function inside can access the variables of the parent function , Function can be used as the return value of another function , It can also be used as a parameter

• The first one is , As a parameter

function fn1(fn){
    
    const a = 100
    fn()
}
const a = 200

function fn(){
    
    console.log(a)
}
fn1(fn)

- The second is the return value

function demo(){
    
	let a = 100
	return function(){
    
		console.log(a)
	}
}
let a = 200
demo()

Two 、 Write a simple closure

The code is as follows （ Example ）：

 function sum(a){
    
          
        return  function sum2(b){
    
                return  a+b
          }
         
    }
    var l=sum(1)(2)  // The ginseng 
    console.log(l);

2. Small cases

The code is as follows （ Example ）：
Error demonstration cases

function sum() {
    
//var Does not have its own scope block , So each loop will overwrite the previous values 
                  for (var index = 0; index < 5; index++) {
    
// Timer cycles are asynchronous programming ,  Set the timer for each cycle ,  There is no need to wait for the timer to trigger execution ,  Continue the next cycle .
 // （ When the timer triggers , The cycle is over ）; 5 The second cycle is over ,
 //  Set up 5 Sub timer ,  The cycle is over ,  The timer hasn't started yet .
//  The loop ends  i = 5;
                        setTimeout(() => {
    
                              console.log(index);
                        }, 1000);
                  }
                  }
            var l = sum()
            console.log(l); // Output 5 5 5 5 , Because of the index It's using var ,
            // Each cycle does not save the corresponding value , Can be replaced by let Block level variables , Will be output 1 2 3 4
          

// This is how to write a closure 
function sum() {
    
//var Does not have its own scope block , So each loop will overwrite the previous values 
                  for (var index = 1; index < 5; index++) {
    
                  // Nested function 
                        (function(j){
    
                              setTimeout(function a(){
    
                                    console.log(j);
                              }, j*1000)
                        })(index)
                        // there index Is the value of each cycle recorded , Will be assigned to j
                  }
            }
            var l = sum()
            console.log(l);
            // Output 1 2 3 4

   // use let To achieve ,let Has its own scope block , Rebinding to each iteration , Each cycle will be reassigned 
            function sum() {
    
                  for (let index = 1; index < 5; index++) {
    
                  // Nested function 
                              setTimeout(function a(){
    
                                    console.log(index);
                              }, index*1000)
                        // there index Is the value of each cycle recorded , Will be assigned to j
                  
            }
      }
            var l = sum()
            console.log();
            // Output 1 2 3 4

summary

Closures are simple , Careful analysis will always work