What is the meaning of closure in JavaScript and how to use it

清浅
Release: 2018-11-21 14:16:10
Original
2438 people have browsed it



This article will share knowledge about closures in JavaScript. It has certain reference value. I hope it will be useful to everyone. Help

A closure is a combination of a function and the lexical environment in which the function is declared. When an internal function is saved to the outside, a closure will be generated and the closure will cause the original scope chain to be lost. Release, causing memory leaks, but at the same time closures are also very useful because they can associate certain data with operations on that data.

Example:

function demo() { var name = '张三'; // name 是demo()创建的局部变量 function demo1() { //demo1()是demo()中的内部函数(闭包) console.log(name); // 使用父函数中声明的变量 } demo1(); }demo();
Copy after login

Running results

Image 1.jpg

Create a local variable named name and a local variable named demo1 in the function demo() () internal function. The demo1() function can only be used within the demo() function body. demo1 has no local variables of its own. But since the internal function can access the variables of the external function, demo1() can access the variable name name declared in the parent function demo(). But if a variable with the same name name is defined in demo1, the name defined in its own function will be used. This example shows that a nested function can access variables declared in its outer scope.

What will happen if the above code is changed to this?

function demo() { var name = '张三'; function demo1() { console.log(name); } return demo1; } var newDemo = demo(); newDemo();
Copy after login

Running results

Image 1.jpg

It can be seen from the running results that the results of the two pieces of code are the same. The internal function demo1() is returned by the external function before execution to form a closure. In this case, newDemo() is a reference to the function demo1 created when running the demo, so the variable name name can still be passed to console.log(name) when newDemo() is called.

Example

function num(x) { return function(y) { return x + y; };} var num1= num(2); var num2 = num(3); console.log(num1(2));// 4 console.log(num2(2));// 5
Copy after login

Running result

Image 2.jpg

Define a function num(x) for receiving A parameter x and returns a new function. This new function also receives a parameter y and returns the sum of x and y; at the same time, two new values num1 and num2 are defined, both of which are closures and the passed values are 2 and 3 respectively.

Summary: The above is the content shared in this article, I hope it will be helpful to everyone.



The above is the detailed content of What is the meaning of closure in JavaScript and how to use it. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!