Javascript scope and hashmaps

Question

I have a function that duplicates a map containing key:function pairs, wrapping each function with a calling funcion.

function duplicateFunctionsMap(functionsMap){

    var newMap = {};

    for (var name in functionsMap){

        var originalFunc = functionsMap[name];

        newMap[name] = function(){
            originalFunc();
        }
    }

    return  newMap;
}

now trying to run any of the entries in the duplicated map turns out always calling the last one

duplicateFunctionsMap({
                      first: function(){alert("first");}, 
                       last: function(){alert("last");}
                      })["first"](); // outputs "last"

score 3 · Accepted Answer · answered Dec 22 '11 at 14:52

You have to introduce a scope to prevent originalFunc from changing. Functions introduce a new scope, but for loops do not:

for (var name in functionsMap){
    (function(originalFunc) {
        newMap[name] = function(){
            originalFunc();
        }; // <-- add semicolon at end of expression, too
    })(functionsMap[name]);
}

Esailija · Answer 2 · 2011-12-22T15:00:41.957

There is nine million duplicates on this but here it goes.. javascript doesn't have a block level scope. Repeat that.

So it becomes:

function duplicateFunctionsMap(functionsMap) {

    var newMap = {};

    for (var name in functionsMap) {
         var originalFunc = functionsMap[name];

        newMap[name] = (function (originalFunc) {
            return function () {
            originalFunc();
            };
        })(originalFunc);

    }

    return newMap;
}

Note that if you want to duplicate functions that use context, arguments and return values you need to do this:

newMap[name] = (function (originalFunc) {
    return function () {
        return originalFunc.apply(this, arguments);
    };
})(originalFunc);

Otherwise your duplicate function loses all that good stuff.

score 0 · Answer 3 · edited May 23 '17 at 12:03

0

inside your for cycle you've probably created a closure. try this code that creates an inner anonymous immediately executed function

for (var name in functionsMap){
    (function(_of) { 
        newMap[name] =  _of;
    }(functionsMap[name]))
}

See also javascript closure immediate evaluation

edited May 23 '17 at 12:03

Community

1
1

answered Dec 22 '11 at 14:53

Fabrizio Calderan

120,726
26
164
177

In this case the anonymous function is overkill, since setting directly works too. – pimvdb Dec 22 '11 at 14:56
this doesn't duplicate the functions – Esailija Dec 22 '11 at 16:54

score 0 · Answer 4 · edited May 23 '17 at 12:27

0

The other answers on this page are correct. But for a detailed explanation on why see my answer to a previously related question:

Please explain the use of JavaScript closures in loops

edited May 23 '17 at 12:27

Community

1
1

answered Dec 22 '11 at 14:57

slebetman

109,858
19
140
171

Javascript scope and hashmaps

4 Answers4