Detailed explanation of closures in JS

This article mainly shares with you the detailed explanation of closures in JS. It mainly explains it to you in the form of code. I hope it can help you.

var n = 999;
function f1() {
  console.log(n);
}
f1() // 999

JavaScript has two scopes: global scope and function scope. Global variables can be read directly inside the function. Function f1 can read the global variable n. However, variables declared inside a function cannot be read outside the function.

function f1() {
  var n = 99;
}
console.log(n);

However, sometimes we need to access variables inside the function from outside the function; under normal circumstances, this is not possible and can only be achieved through workarounds. That is to define another function inside the function.

function f1() {
  var n = 999;
  var f2 = function() {
      console.log(n);
  }
return f2;
}
var f = f1();
f();

In the above code, function f2 is inside function f1. At this time, all local variables inside f1 are visible to f2. But the reverse doesn't work. The local variables inside f2 are invisible to f1. This is the unique "chain scope" structure of the JavaScript language. The child object will search for the variables of all parent objects level by level. Therefore, all variables of the parent object are visible to the child object, but not vice versa.

Since f2 can read the local variables of f1, then just change f2As the return value, we can not read its internal variables outside f1. The closure is the function f2, a function that can read the internal variables of other functions. Since in the JavaScript language, only subfunctions within a function can read internal variables, closures can be simply understood as "functions defined inside a function." The biggest feature of closure is that it can "remember" the environment in which it was born. For example, f2 remembers the environment f1 in which it was born, so the internal variables of f1 can be obtained from f2. In essence, a closure is a bridge connecting the inside of a function to the outside of the function. That is, there are two biggest uses of closures. One is to read the variables inside the function, and the other is to keep these variables in the memory. That is, the closure can make the environment in which it was born always exist;
Related recommendations:

A brief explanation of closures in JS

How to use closures in js?

A brief discussion on closures in js_javascript skills

The above is the detailed content of Detailed explanation of closures in JS. For more information, please follow other related articles on the PHP Chinese website!