Discussion sur le passage des paramètres de fermeture javascript et la liaison de boucles d'événements examples_javascript skills

Aujourd'hui, j'ai vu une question javascript qui reliait les événements dans une boucle selon le bon sens, mais le résultat n'était pas celui que je souhaitais.

Pour faire simple, il s'agit d'un problème de portée de variable de fonction. Si function() { alert(i); return false; est considérée comme une fonction a(); a(), mais il est utilisé en interne, j'ai donc cherché à l'extérieur et trouvé le i défini dans la boucle for. L'événement click a commencé à être exécuté après la fin de la boucle for. Après l'exécution, la valeur de i est devenue -. 1 ; donc à chaque fois qu'il apparaît, c'est -1 ;

2. La boucle for avec 2 paramètres n'est pas non plus courante ! Embrouiller?

　for (instruction 1, instruction 2, instruction 3) {

　 //todo

　}

a.for condition de boucle

D'une manière générale, l'instruction 1, l'instruction 2 et l'instruction 3 sont toutes facultatives.

b. Déclaration 2 :

Habituellement, la déclaration 2 est utilisée pour évaluer les conditions des variables initiales.

La déclaration 2 est également facultative.

Si l'instruction 2 renvoie vrai, la boucle recommencera, si elle renvoie faux, la boucle se terminera.

Astuce : Si vous omettez l'instruction 2, vous devez prévoir une pause à l'intérieur de la boucle. Sinon, le cycle ne peut pas être arrêté. Cela peut faire planter le navigateur.

c. Concernant le i--jugement :

Lorsque l'on juge i--vrai/faux, i est d'abord jugé, puis i-- est calculé. Lors de la saisie du dernier jugement de i--, lorsque i==0 a été réellement jugé, i-- a été exécuté à nouveau après le jugement et la boucle for s'est terminée, donc la valeur de i est devenue -1 ; var i = 1;

　!!i--;//ture

Solution :




Copier le code(function (i){

Copier le codevar a = function(i){ Copier le code

function init() {
var pAry = document.getElementsByTagName("p"); >for( var i=0; ipAry[i].i = i;

pAry[i].onclick = function() { alert(this. i); } } }

2. Enregistrez la variable i dans la fonction anonyme elle-même

Copier code


Le code est le suivant :

function init2() {
var pAry = document.getElementsByTagName("p");
for( var i=0; i(pAry [i].onclick = function() {
alerte(arguments.callee.i);
}).i = i
}
}

3 , ajoutez une couche de fermeture, et i est transmis à la fonction interne sous forme de paramètres de fonction

Copier le code Le code est comme suit :

function init3() {
var pAry = document.getElementsByTagName("p");
for( var i=0; i(function( arg){
pAry[i].onclick = function() {
alert(arg);
};
})(i);//Paramètres quand appeler
}
}

4. Ajoutez une couche de fermeture et passez i à la fonction mémoire sous la forme d'une variable locale

Copier le code Le code est le suivant :

function init4() {
var pAry = document.getElementsByTagName("p");
for( var i=0; i(function () {
var temp = i; //Variable locale lorsqu'elle est appelée
pAry[i].onclick = function() {
alert(temp);
}
})();
}
}

5. renvoie une fonction comme événement de réponse (notez la différence subtile avec 3)

Copier le code Le code est le suivant :

function init5() {
var pAry = document .getElementsByTagName("p");
for( var i=0; ipAry[ i].onclick = function(arg) {
return function() { //Renvoie une fonction
alert(arg);
}
}(i); }


6. Utilisez Function pour implémenter, en fait Chaque fois qu'une instance de fonction est générée, une fermeture sera générée

Copier le code Le code est le suivant :

function init6() {

var pAry = document.getElementsByTagName("p"); 0; ipAry[i].onclick = new Function ("alert(" i ");");//new génère une instance de fonction à la fois
}
}


7. Utilisez la fonction pour implémenter, faites attention à la différence de 6

Copier le code Le code est le suivant : function init7() {

var pAry = document. getElementsByTagName("p"); .length; i ) {

pAry[i].onclick = Function('alert(' i ')')
}
}


Le résumé est complet, bienvenue pour participer !