Fermeture de boucles intérieures JavaScript – simple exemple pratique

Mots clés : javascriptloopsclosuresjavascript

meilleur 5 Réponses Fermeture de boucles intérieures JavaScript – simple exemple pratique

vote vote

91

for (let i = 0; i < 3; i++) {   funcs[i] = function() {     console.log("My value: " + i);   }; } 
var someArray = [ /* whatever */ ]; // ... someArray.forEach(function(arrayElement) {   // ... code code code for this one element   someAsynchronousFunction(arrayElement, function() {     arrayElement.doSomething();   }); }); 
var funcs = [];  function createfunc(i) {   return function() {     console.log("My value: " + i);   }; }  for (var i = 0; i < 3; i++) {   funcs[i] = createfunc(i); }  for (var j = 0; j < 3; j++) {   // and now let's run each one to see   funcs[j](); }
vote vote

81

var funcs = [];        for (var i = 0; i < 3; i++) {      funcs[i] = (function(index) {          return function() {              console.log("My value: " + index);          };      }(i));  }    for (var j = 0; j < 3; j++) {      funcs[j]();  }
vote vote

71

var funcs = {};  for (var i = 0; i < 3; i++) {    funcs[i] = function(x) {      console.log('My value: ' + x);    }.bind(this, i);  }  for (var j = 0; j < 3; j++) {    funcs[j]();  }
function log(x) {    console.log('My value: ' + x);  }    var funcs = [];    for (var i = 0; i < 3; i++) {    funcs[i] = log.bind(this, i);  }    for (var j = 0; j < 3; j++) {    funcs[j]();  }
vote vote

69

for (var i = 0; i < 3; i++) {        (function(index) {            console.log('iterator: ' + index);          //now you can also loop an ajax call here           //without losing track of the iterator value:   $.ajax({});            })(i);    }
vote vote

57

//overwrite console.log() so you can see the console output console.log = function(msg) {document.body.innerHTML += '<p>' + msg + '</p>';};  var funcs = {}; for (var i = 0; i < 3; i++) {     var ilocal = i; //create a new local variable     funcs[i] = function() {         console.log("My value: " + ilocal); //each should reference its own local variable     }; } for (var j = 0; j < 3; j++) {     funcs[j](); }
//overwrite console.log() so you can see the console output console.log = function(msg) {document.body.innerHTML += '<p>' + msg + '</p>';};  var funcs = {}; for (var i = 0; i < 3; i++) {   console.log(ilocal);   var ilocal = i; }
//overwrite console.log() so you can see the console output console.log = function(msg) {document.body.innerHTML += '<p>' + msg + '</p>';};  var funcs = {}; for (var i = 0; i < 3; i++) {     funcs[i] = (function() { //create a new scope using a wrapper function         var ilocal = i; //capture i into a local var         return function() { //return the inner function             console.log("My value: " + ilocal);         };     })(); //remember to run the wrapper function } for (var j = 0; j < 3; j++) {     funcs[j](); }
//overwrite console.log() so you can see the console output console.log = function(msg) {document.body.innerHTML += '<p>' + msg + '</p>';};  var funcs = {}; for (var i = 0; i < 3; i++) {     funcs[i] = wrapper(i); } for (var j = 0; j < 3; j++) {     funcs[j](); } //creates a separate environment for the inner function function wrapper(ilocal) {     return function() { //return the inner function         console.log("My value: " + ilocal);     }; }
//overwrite console.log() so you can see the console output console.log = function(msg) {document.body.innerHTML += '<p>' + msg + '</p>';};  var funcs = {}; for (let i = 0; i < 3; i++) { // use "let" to declare "i"     funcs[i] = function() {         console.log("My value: " + i); //each should reference its own local variable     }; } for (var j = 0; j < 3; j++) { // we can use "var" here without issue     funcs[j](); }

Questions similaires