Scope of anonymous function passed as function argument

Question

Given the following code, what should I expect to see in the alert?

var a = 100;
function afunc(infunc){
  a = 10;
  infunc.call();
}

afunc(function(){alert(a)});

My initial thought was that my browser should alert 100 since the variable a=100 would be in scope for the anonymous function passed as an argument to afunc. But this assumes that the anonymous function is actually defined in the global context. Apparently that's not the case as the browser alerts 10. So why is a=10 ahead of a=100 in the scope chain?

Thanks!

Rick Mangi · Accepted Answer · 2012-07-20 16:30:22Z

6

Because you're setting a to 10 before you call the anonymous function. a is in fact global, but you're setting it to 10.

answered Jul 20, 2012 at 16:30

Rick Mangi

3,7691 gold badge16 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jonathan Lonowski · Accepted Answer · 2012-07-20 16:31:13Z

6

So why is a=10 ahead of a=100 in the scope chain?

It's not. You've only defined 1 a variable, which is simply being changed from 100 to 10 before being alerted.

If you want the as to be distinct variables with their own values, they both need a var keyword:

var a = 100
function afunc(infunc){
  var a = 10;
  infunc.call();
}

afunc(function(){alert(a)})

answered Jul 20, 2012 at 16:31

Jonathan Lonowski

124k35 gold badges203 silver badges202 bronze badges

Comments

Brandan · Accepted Answer · 2012-07-20 16:54:41Z

Consider the following example:

var a = 100;

function afunc(infunc){
  a = 10;
  var f = function (){
    console.log(a);
  };
  f.call();
  infunc.call();
}

afunc(function (){ console.log(a); });

We assign a value of 10 to a within the scope of afunc, and then call two functions one after the other that simply log the value of a. In this case, you would expect both functions to log 10 as the value of a, and that's in fact what happens.

In your example, infunc will be executed in essentially the same scope as any local function defined in afunc, regardless of where it was actually defined. Since you assigned a value to a in a narrower scope, that's the value of a when you call infunc.

Functions do retain some scope from their definition, as in the following example:

function bfunc(){
  var b = 'hello';
  return function (){ console.log(b); };
}

afunc(bfunc());

Here, the anonymous function returned by bfunc is actually called from within the scope of afunc, but it's still able to log the correct value of b as it was assigned in the original scope. If you were to change afunc to assign a different value to b, it would still log "hello" because the b defined in afunc is a different variable than the b defined in bfunc.

Collectives™ on Stack Overflow

Scope of anonymous function passed as function argument

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related