Ok, difficult to understand from the title only. Here is an example. I want a function to refer to a variable that is "injected" automagically, ie:

function abc() {
   console.log(myVariable);
}

I have tried with:

with({myVariable: "value"}) { abc() } 

but this doesn't work unless abc is declared within the with block, ie:

with({myVariable: "value"}) { 

    function abc() {
       console.log(myVariable);
    }

    abc();  // This will work

}

So the last piece will work, but is it possible to fake the with statement, or do I have to force the developers to declare their function calls in a with statement?

Basically the call I want to do is:

doSomething({myVariable: "value"}, function() {
    console.log(myVariable);
});

Ofcourse, I am aware I could pass this is a one parameter object, but that is not what I am trying to do:

doSomething({myVariable: "value"}, function(M) {
    console.log(M.myVariable);
});

Further more, I am trying to avoid using eval:

with({myVariable: "value"}) { 

    eval(abc.toString())(); // Will also work

}

Is this not supported at at all beyond eval in Javascript?

Ok, difficult to understand from the title only. Here is an example. I want a function to refer to a variable that is "injected" automagically, ie:

function abc() {
   console.log(myVariable);
}

I have tried with:

with({myVariable: "value"}) { abc() } 

but this doesn't work unless abc is declared within the with block, ie:

with({myVariable: "value"}) { 

    function abc() {
       console.log(myVariable);
    }

    abc();  // This will work

}

So the last piece will work, but is it possible to fake the with statement, or do I have to force the developers to declare their function calls in a with statement?

Basically the call I want to do is:

doSomething({myVariable: "value"}, function() {
    console.log(myVariable);
});

Ofcourse, I am aware I could pass this is a one parameter object, but that is not what I am trying to do:

doSomething({myVariable: "value"}, function(M) {
    console.log(M.myVariable);
});

Further more, I am trying to avoid using eval:

with({myVariable: "value"}) { 

    eval(abc.toString())(); // Will also work

}

Is this not supported at at all beyond eval in Javascript?

• javascript

• 2 Why are you trying to avoid using an object? Seems like the best solution. with and eval are slow, and with will throw error in ES5. – elclanrs Commented Jul 17, 2013 at 0:08
• 1 JavaScript has lexical scope, so that is not possible. – Felix Kling Commented Jul 17, 2013 at 0:09
• 1 developer.mozilla/en-US/docs/Web/JavaScript/Guide/Closures is almost related – bbill Commented Jul 17, 2013 at 0:11
• 2 The eval solution has the problem that your are destroying the function the developer passed and if the function has free variables (i.e. it is a closure) it won't work as expected. Personally I find an API more "developer friendly" if I can easily follow/understand how it works. Doing some "magic" (if there is any) in the back is not a good idea IMO. – Felix Kling Commented Jul 17, 2013 at 0:14
• 3 FWIW I would remend telling developers to write this.variable instead of just variable in the function, then you can .call their callback and supply context. Of course this is only doable if you don't want to use this for something else. – Jon Commented Jul 17, 2013 at 0:17

8 Answers 8

JavaScript does not provide any straightforward way to achieve the syntax you're looking for. The only way to inject a variable into a Lexical Environment is by using eval (or the very similar Function constructor). Some of the answers to this question suggest this. Some other answers suggest using global variables as a workaround. Each of those solutions have their own caveats, though.

Other than that, your only option is to use a different syntax. The closest you can get to your original syntax is passing a parameter from doSomething to the callback, as Aadit M Shah suggested. Yes, I am aware you said you don't want to do that, but it's either that or an ugly hack...

Original answer (written when I didn't fully understand the question)

Maybe what you're looking for is a closure? Something like this:

var myVariable = "value";
function doSomething() {
    console.log(myVariable);
};
doSomething(); // logs "value"

Or maybe this?

function createClosure(myVariable) {
    return function() {
        console.log(myVariable);
    };
}
var closure = createClosure("value");
closure(); // logs "value"

Or even:

var closure = function(myVariable) {
    return function() {
        console.log(myVariable);
    };
}("value");
closure(); // logs "value"

I asked a similar question a long time ago: Is it possible to achieve dynamic scoping in JavaScript without resorting to eval?

The short answer is no, you can't achieve dynamic scoping without resorting to eval. The long answer is, you don't need to.

JavaScript doesn't support dynamic scoping, but that's not an issue because you can make your free variables parameters of the function that they belong to.

In my humble opinion this is the best solution:

function doSomething(context, callback) {
    callback(context);
}

doSomething({myVariable: "value"}, function(M) {
    console.log(M.myVariable);
});

However since you don't want to write a formal parameter, the next best thing is to use this instead:

function doSomething(context, callback) {
    callback.call(context);
}

doSomething({myVariable: "value"}, function() {
    console.log(this.myVariable);
});

Another option would be to manipulate the formal parameter list of the program as follows:

function inject(func, properties) {
    var args = [], params = [];

    for (var property in properties) {
        if (properties.hasOwnProperty(property)) {
            args.push(properties[property]);
            params.push(property);
        }
    }

    return Function.apply(null, params.concat("return " + func.toString()))
        .apply(null, args);
}

Now we can use this inject method to inject properties into a function as follows:

function doSomething(context, callback) {
    var func = inject(callback, context);
    func();
}

doSomething({myVariable: "value"}, function() {
    console.log(myVariable);
});

See the demo: http://jsfiddle/sDKga/1/

Note: The inject function will create an entirely new function which will not have the same lexical scope as the original function. Hence functions with free variables and partially applied functions will not work as expected. Only use inject with normal functions.

The Function constructor is kind of like eval but it's much safer. Of course I would advise you to simply use a formal parameter or this instead. However the design decision is your choice.

Try:

function doSomething(vars, fun) {
    for (var key in vars) { // set the variables in vars
        window[key] = vars[key];
    }
    fun.call(); // call function
    for (var key in vars) { // remove the variables again. this will allow only the function to use it
        delete window[key];
    }
}

Set global variables that can then be received inside of fun

The JSFiddle: http://jsfiddle/shawn31313/MbAMQ/

Warning: disgusting code ahead

function callWithContext(func, context, args) {
    var oldProperties = {};

    for(var n in context) {
        if(context.hasOwnProperty(n)) {
            var oldProperty = Object.getOwnPropertyDescriptor(self, n);
            oldProperties[n] = oldProperty;

            (function(n) {
                Object.defineProperty(self, n, {
                    get: function() {
                        if(arguments.callee.caller === func) {
                            return context[n];
                        }

                        if(!oldProperty) {
                            return;
                        }

                        if(oldProperty.get) {
                            return oldProperty.get.apply(this, arguments);
                        }

                        return oldProperty.value;
                    },
                    set: function(value) {
                        if(arguments.callee.caller === func) {
                            context[n] = value;
                        }

                        if(!oldProperty) {
                            return;
                        }

                        if(oldProperty.set) {
                            return oldProperty.get.apply(this, arguments);
                        } else if(!oldProperty.writable) {
                            var fakeObject = {};
                            Object.defineProperty(fakeObject, n, {value: null, writable: false});
                            fakeObject[n] = value; // Kind of stupid, but…
                            return;
                        }

                        oldProperty.value = value;
                    }
                });
            })(n);
        }
    }

    func.apply(this, args);

    for(var n in context) {
        if(context.hasOwnProperty(n)) {
            if(oldProperties[n]) {
                Object.defineProperty(self, n, oldProperties[n]);
            } else {
                delete self[n];
            }
        }
    }
}

This is vomitously horrendous, by the way; don’t use it. But ew, it actually works.

i don't see why you can't just pass the info in or define a single global, but i think that would be best.

that said, i am working on a Module maker/runner that allows sloppy/dangerous code to execute without interference to the host environment. that provides the opportunity to re-define variables, which can be passed as an object.

this does use eval (Function() technically) but it can run in "use strict", so it's not too crazy/clever. it doesn't leave behind artifacts. it also won't let globals get hurt.

it's still a work in progress, and i need to iron out a couple minor details before i vouch for security, so don't use it for fort knox or anything, but it's working and stable enough to perform the operation asked for.

tested in ch28, FF22, IE10:

function Module(strCode, blnPreventExtensions, objWhitelist, objExtend) {
   var  __proto__=self.__proto__, pbu=self.__proto__, str=strCode, om=[].map, wasFN=false,
    params = {Object:1}, fnScrubber, natives= [ Object, Array, RegExp, String, Boolean, Date] ,
    nativeSlots = [],
        preamble = "'use strict';" ,
                inherited="__defineGetter__,__defineSetter__,__proto__,valueOf,constructor,__lookupGetter__,__lookupSetter__",
        late = inherited + 
                Object.getOwnPropertyNames(__proto__||{}) + Object.getOwnPropertyNames(window);
    late.split(",").sort().map(function(a) {
        this[a] = 1;
    }, params);

        preamble+=";var "+inherited+";";

        //turn functions into strings, but note that a function was passed
         if(str.call){wasFN=true; str=String(str); delete params.Object; }

           objExtend=objExtend||{};
           var vals=Object.keys(objExtend).map(function(k){ return objExtend[k]; })


        // build a usable clone of Object for all the new OOP methods it provides:
        var fakeOb=Object.bind();
        (Object.getOwnPropertyNames(Object)||Object.keys(Object)).map(function(a){
                 if(Object[a] && Object[a].bind){this[a]=Object[a].bind(Object); } return this;
        },fakeOb)[0];



    //allow "eval" and "arguments" since strict throws if you formalize them and eval is now presumed safe.
        delete params.eval;
        delete params.arguments;
        params.hasOwnProperty=undefined;
        params.toString=undefined;
                params['__proto__']={};
                __proto__=null;


        Object.keys(objWhitelist||{}).map(function ripper(a,b){
                b=this[a];
                if(typeof b!=='object'){ 
                    delete this[a];
                }
         }, params);

        // var ok=Object.keys.bind(Object);

    // prevent new prototype methods from being added to native constructors:
    if (blnPreventExtensions) {
        natives.forEach(function(con, i) {
                       var proto=con.prototype;
                       Object.getOwnPropertyNames(proto).map(function(prop){ 
                              if(proto[prop] && proto[prop].bind ){ this[prop]=proto[prop];} 
                        }, nativeSlots[i] = {});
                         delete con.constructor;
                         delete con.prototype.constructor;  
        }); //end con map()
    } /* end if(blnPreventExtensions) */


    //white-list harmless math utils and prevent hijacking:
    delete params.Math;
    if(blnPreventExtensions){Object.freeze(Math);}

    //prevent literal constructors from getting Function ref (eg: [].constructor.constructor, /./.constructor.constructor, etc...):
    Function.prototype.constructor = null;


    try {
                //generate a private wrapper function to evaluate code:
        var response = Function(
                   Object.keys(objExtend) + (vals.length?",":"") +
           Object.keys(params).filter(/./.test, /^[\w\$]+$/), // localize most globals
           preamble + " return " + str.trim() // cram code into a function body with global-blocking formal parameters
        );


               // call it with a blank this object and only user-supplied arguments:
               if (blnPreventExtensions) {  //( user-land code must run inside here to be secure)
                       response = response.apply({}, vals.concat(fakeOb)).apply({}, [].slice.call(arguments,4) ); 
               }else{
                       response = response.apply({}, vals.concat(fakeOb)); 
               }

    } catch (y) {
        response = y + "!!";
    } /* end try/catch */


    if (blnPreventExtensions) {
        om.call(natives, function(con, i) {
                        var pro=con.prototype;

                        //remove all proto methods for this con to censor any additions made by unsafe code:
                        Object.getOwnPropertyNames(pro).map(function(a){ try{delete pro[a];}catch(y){}});

                        //restore all original props from the backup:
            var bu = nativeSlots[i];
            om.call(Object.keys(bu), function(prop){ con.prototype[prop]=bu[prop]; }, bu);

        }); //end con map()
    } /* end if(blnPreventExtensions) */

       //restore hidden Function constructor property:
       Function.prototype.constructor = Function;
    return response;
} /* end Module() */

/////////////////////////////////////////////////////////////


function doSomething(context, fn){
    console.log(myVariable);
    return myVariable;
}


//use 1:
 alert(    Module(doSomething, true, {console:1}, {myVariable: "value123"} )    );// immed

//use2:
var fn=Module(doSomething, false, {console:1}, {myVariable: "value123"} );// as function
alert(fn);
alert(fn());

again, i think OP would be best off not doing things later than need be, but for the sake of prehensiveness and inspiration i'm putting this out there in good faith.

You need to use call() to construct a context, as in:

var f=function(){
    console.log(this.foo);
};

f.call({foo:'bar'})

will print "bar"

You can avoid using eval() in calling the function, if you are willing to use it in doSomething():

function abc() {
   console.log(myVariable);
}

// Prints "value"
callWith({ myVariable: "value" }, abc);

function callWith(context, func) {
  for(var i in context) eval('var ' + i + ' = context[i];');

  eval('(' + func.toString() + ')')();
}

Have a look at this post.

Have a look at goog.partial, scroll a little bit up to see the description of what it does:

Here is an implementation of it:

var b = goog.partial(alert, 'Hello world!');
b();//alerts "Hello world!"

In the example it passes the function alert with parameter "Hello world!" but you can pass it your own function with multiple parameters.

This allows you to create a variable that points to a function that is always called with a certain paramater. To use parameters in a function that are not named you can use arguments:

function test(){
  console.log(arguments);//["hello","world"]
}

test("hello","world");