Why do these javascript variables share scope?

Question

Since there are two separate functions involved, namely _GetFoo and _CountBar shouldn't the variable bar be in a different scope even though they both use it? If you copy paste this and then run it, it will display the problem with two alerts.

<script type="text/javascript">
 var example = function () {

    var Foo = [];

    function _BuildFoo(size) {
        for (var buildSize = 0; buildSize < size; buildSize++) {
            Foo.push(buildSize);
        }
    }

    function _GetFoo(index) {
        for (bar in Foo) {
            //do Foo bar
        }
    }

    function _CountBar() {
        for (bar in Foo) {
         alert(bar); //bar = 0
         _GetFoo(1);
         alert(bar); //bar is incremented from _GetFoo function and is now 19
         break;
        }
    }

    return {
        _CountBar: _CountBar,
        _BuildFoo: _BuildFoo
    }
}

var foobar = new example();
foobar._BuildFoo(20);
foobar._CountBar();
</script>

Why do _GetFoo and _CountBar share scope?

Because without being bound to each function's scope, JS assumes that bar is attached to the global scope. Try var bar; for (bar in Foo) /* ... */ instead :^) — rjz
– rjz, Commented May 20, 2012 at 21:12

Sophie Alpert · Accepted Answer · 2012-05-20 21:12:58Z

4

Without the keyword var, bar becomes a global variable. You need:

for (var bar in Foo) {

or alternatively,

var bar;
for (bar in Foo) {

answered May 20, 2012 at 21:12

Sophie Alpert

144k37 gold badges229 silver badges244 bronze badges

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

Comments

Derek 朕會功夫 · Accepted Answer · 2012-05-20 21:12:58Z

1

They both share example because they both are in a function.

Also, bar is not declared, and JavaScript will assume it is global.

answered May 20, 2012 at 21:12

Derek 朕會功夫

94.8k45 gold badges199 silver badges255 bronze badges

Comments

Bergi · Accepted Answer · 2012-05-20 21:18:29Z

0

No, bar is not declared as a local variable in the function scope.

But there's something worse: Never use for-in-loops for arrays!

var foo = [];
for (var i=0; i<foo.length; i++)
    // do something with foo[i]

answered May 20, 2012 at 21:18

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Comments

ajax333221 · Accepted Answer · 2012-05-20 21:20:44Z

0

Just to expand a little the other answers, there are two ways to avoid creating global vars through functions:

Use the var keyword, e.g var foo
Create the variable in the function parameters, e.g function myFunc(foo)

answered May 20, 2012 at 21:20

ajax333221

11.9k16 gold badges65 silver badges95 bronze badges

Collectives™ on Stack Overflow

Why do these javascript variables share scope?

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related