Home Web Front-end JS Tutorial A few simple sentences explaining JavaScript closures_javascript skills

A few simple sentences explaining JavaScript closures_javascript skills

May 16, 2016 pm 06:11 PM
javascript Closure

What is the stack area and pre-execution process that have not released resources? Let us use the most common example to explain:
For example, now we have a ul with many li below it. We need to traverse them and bind click events to them. And after clicking, pass the current subscript to another function for additional processing:

Copy code The code is as follows:

for(var i=0; i agroup[i].onclick = function() {
 handler(i);
 }
}

The execution result is obvious, right? In the handler, get the passed parameter i, and all you will see is the largest subscript. At this time, we usually use the following method Solution:
Copy code The code is as follows:

for(var i=0; i agroup[i].i = i
agroup[i].onclick = function() {
handler(this.i);
}
}

So here, let’s talk about the pointing issue of this. Generally speaking, this in JavaScript points to the object that currently references it. Above we have added a new attribute called i to this, and its value is the current subscript value.
So how to solve this problem using closure? In fact, the principle is the same. We need to save the i value in advance, or call it transfer:
Copy code The code is as follows:

for(var i=0; i agroup[i].onclick = function(index) {
return function() {
handler (index);
 }
 }(i);
}

At this time you will get the correct subscript. How is this similar to adding the i attribute? ? That is, they all pass or store the subscript i value in advance. In the above demonstration, the function referenced by onclick is pre-executed, and this
function returns an inline function, forming a stack area with no released resources, and the i value is changed to the parameter during pre-execution. The form is passed into this scope (there is a problem with the explanation ability, I don’t know if this explanation is accurate, please give me a try).
To sum up, the role of closure is usually to change the scope or pre-execution. It should be clear to the reader that the examples given above are very limited. The application range of closures is very wide. Only by understanding its cause and effect can you use it flexibly.
auntion 2011-11-15
mail Auntion@gmail.com
QQ 82874972
Original article, please respect the hard work of typing and the rights of the author. Please do not delete the author information here when reprinting.
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

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Repo: How To Revive Teammates
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

What is the meaning of closure in C++ lambda expression? What is the meaning of closure in C++ lambda expression? Apr 17, 2024 pm 06:15 PM

What is the meaning of closure in C++ lambda expression?

How to implement closure in C++ Lambda expression? How to implement closure in C++ Lambda expression? Jun 01, 2024 pm 05:50 PM

How to implement closure in C++ Lambda expression?

What are the advantages and disadvantages of closures in C++ functions? What are the advantages and disadvantages of closures in C++ functions? Apr 25, 2024 pm 01:33 PM

What are the advantages and disadvantages of closures in C++ functions?

Solve the memory leak problem caused by closures Solve the memory leak problem caused by closures Feb 18, 2024 pm 03:20 PM

Solve the memory leak problem caused by closures

The impact of function pointers and closures on Golang performance The impact of function pointers and closures on Golang performance Apr 15, 2024 am 10:36 AM

The impact of function pointers and closures on Golang performance

How are closures implemented in Java? How are closures implemented in Java? May 03, 2024 pm 12:48 PM

How are closures implemented in Java?

Chained calls and closures of PHP functions Chained calls and closures of PHP functions Apr 13, 2024 am 11:18 AM

Chained calls and closures of PHP functions

Summary of the advantages and disadvantages of golang anonymous functions and closures Summary of the advantages and disadvantages of golang anonymous functions and closures May 05, 2024 am 09:54 AM

Summary of the advantages and disadvantages of golang anonymous functions and closures

See all articles