Before we begin, take a look at Fang yinghang’s explanation of closures
Closure — Fang Yinghang
The article points out that the sum of the “function” and the “variables accessible within the function” (also known as the environment) is a closure.
- Remember that closures are variables plus functions, they are scope-to-scope, but they must be variables plus functions
The first thing you need to know about closures is scope. What is scope
Let’s look at this figure. Students are always managed by the school. Each circle is a scope of scope
Then let’s look at the collection of variables in the global context
Note, do not believe you also write a try, after clicking will be recycled, of course not, countless clicks will pop up, will not be destroyed
The global variables of the browser, because we use them in the console, like the window property, are not recycled, only when the browser is closed
But the drill guy has a problem, so now it’s the global let, so in the global let, where does this thing declare
- I gave a couple of examples on the console
- See, there’s no window. Let’s see where he is
- See, its scope is inside script, its scope is global but it doesn’t include Windows
- I don’t know what scope is, but after reading this article and then reading this article, you will understand what scope is, and you will understand closures
The relationship between function closures, Scopes and [[Scopes]]
- Someone sees what gobal is, script is the current page, I write the article without question, directly together
- So how do you access the script scope, you know, the current code block, isn’t it just called directly
- What’s global
As discussed in JS Advanced Programming, the Global object is a special object in ECMAScript because it doesn’t exist in any way you look at it. In a sense, it is the ultimate “bottom-object,” in other words, properties and methods that do not belong to any other object are ultimately its properties and methods. I understand that this global object, is the whole JS “ancestor”, can not find the attribution of those “children and grandchildren” can come to it here to identify ancestors. All properties and functions defined in the global scope are properties and methods of the global object, such as isNaN(), parseInt(), and parseFloat(), which are actually its methods; There are also some common special values, such as NaN and undefined are its attributes, and some constructors Object and Array are also its methods. In short, remember that a global object is an ancestor, and everything that can’t be found belongs to it.
Global objects, Window objects, and Document objects in JavaScript
Here is how I understand closures. I followed the article, read Fang Yinghang’s article, and then read the linkThe relationship between function closures, Scopes and [[Scopes]]You will understand
The final summary
- A closure is the sum of the “function” and the “variables accessible within the function” (also known as the environment).
- I want to show you something
- It can be seen that JS has the characteristics of closure, the child function can access the data of the parent function, this is closure
- In doing the project often see the teacher to cache a variable, learn closure found that this solves the memory leak