Last active
September 19, 2017 15:49
-
-
Save thurt/4c1d4e2e471c86965e14 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//////////////////////////// | |
// using inline closure | |
//////////////////////////// | |
(function() { | |
arr = [] | |
for (i = 0; i < 10; i++) | |
arr[i] = (function(i) { | |
return function() { console.log("I am #" + i) } | |
})(i) | |
for (j = 0; j < 10; j++) | |
arr[j]() | |
})() | |
///////////////////////////////// | |
// using closure in a function | |
///////////////////////////////// | |
(function() { | |
arr = [] | |
function closure(i, fn) { | |
return function() { return fn(i) } | |
} | |
for (i = 0; i < 10; i++) | |
arr[i] = closure(i, function(i) { console.log("I am #" + i) }) | |
for (j = 0; j < 10; j++) | |
arr[j]() | |
})() | |
////////////////////////////// | |
// using Function constructor | |
////////////////////////////// | |
(function() { | |
arr = [] | |
for (i = 0; i < 10; i++) | |
arr[i] = Function("console.log('I am #" + i + "')") | |
for (j = 0; j < 10; j++) | |
arr[j]() | |
})() | |
///////////////////////////// | |
// using bind | |
///////////////////////////// | |
(function() { | |
arr = [] | |
for (i = 0; i < 10; i++) | |
arr[i] = function(i) { console.log("I am #" + i) }.bind(null, i) | |
for (j = 0; j < 10; j++) | |
arr[j]() | |
})() | |
////////////////////////////// | |
// using let (requires ES6) | |
////////////////////////////// | |
// In Chrome (v46) ! I have to use strict mode to use "let" | |
// ~ which also does not allow globals | |
// ~ so we must add var in front of variable names | |
(function() { | |
'use strict' | |
var arr = [] | |
for (let i = 0; i < 10; i++) | |
arr[i] = function() { console.log("I am #" + i) } | |
for (var j = 0; j < 10; j++) | |
arr[j]() | |
})() | |
//////////////////////// | |
// using currying | |
//////////////////////// | |
(function() { | |
arr = [] | |
function curry(i) { | |
return function(fn) { | |
return function() { | |
return fn(i) | |
} | |
} | |
} | |
for (i = 0; i < 10; i++) | |
arr[i] = curry(i)(function(i) { console.log("I am #" + i) }) | |
for (j = 0; j < 10; j++) | |
arr[j]() | |
})() | |
///////////////////////// | |
// using Array functions | |
///////////////////////// | |
(function() { | |
arr = Array(10) | |
arr.fill(null) | |
.forEach(function(_, i) { | |
arr[i] = function() { console.log("I am #" + i) } | |
}) | |
for (j = 0; j < 10; j++) | |
arr[j]() | |
})() | |
///////////////////////////// | |
// using time indexing array | |
///////////////////////////// | |
(function() { | |
arr = [] | |
t = [] // time index -- stores a value at each loop interation | |
for (i = 0; i < 10; i++) { | |
t[i] = i // you could record any value for this time point | |
arr[i] = function(i) { console.log("I am #" + i) } | |
} | |
for (j = 0; j < 10; j++) | |
arr[j](t[j]) // Note: this function invocation is different than other alternatives | |
})() |
Each of the alternatives here are made to be copy/pasted directly into your javascript console. You will instantly see the results.
The jsperf link above has versions of each of these with just the "setting values" portion.
Added two more alternatives: http://jsperf.com/closure-alternativess/4
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
http://jsperf.com/closure-alternativess