• support@answerspoint.com

What is the scope of variables in JavaScript?

400

What is the scope of variables in javascript? Do they have the same scope inside as opposed to outside a function? Or does it even matter? Also, where are the variables stored if they are defined globally?

1Answer


0

I think about the best I can do is give you a bunch of examples to study. Javascript programmers are practically ranked by how well they understand scope. It can at times be quite counter-intuitive.

  1. A globally-scoped variable

    var a = 1;
    
    // global scope
    function one() {
      alert(a);
    }
  2. Local scope

    var a = 1;
    
    function two(a) {
      alert(a);
    }
    
    // local scope again
    function three() {
      var a = 3;
      alert(a);
    }
  3. IntermediateNo such thing as block scope in JavaScript (ES5; ES6 introduces let)

    var a = 1;
    
    function four() {
      if (true) {
        var a = 4;
      }
    
      alert(a); // alerts '4', not the global value of '1'
    }
  4. IntermediateObject properties

    var a = 1;
    
    function five() {
      this.a = 5;
    }
  5. AdvancedClosure

    var a = 1;
    
    var six = (function() {
      var a = 6;
    
      return function() {
        // JavaScript "closure" means I have access to 'a' in here,
        // because it is defined in the function in which I was defined.
        alert(a);
      };
    })();
  6. AdvancedPrototype-based scope resolution

    var a = 1;
    
    function seven() {
      this.a = 7;
    }
    
    // [object].prototype.property loses to
    // [object].property in the lookup chain. For example...
    
    // Won't get reached, because 'a' is set in the constructor above.
    seven.prototype.a = -1;
    
    // Will get reached, even though 'b' is NOT set in the constructor.
    seven.prototype.b = 8;
  7. Altogether

    // These will print 1-8
    one();
    two(2);
    three();
    four();
    alert(new five().a);
    six();
    alert(new seven().a);
    alert(new seven().b);

  8. Global+LocalAn extra complex Case

    var x = 5;
    
    (function () {
        console.log(x);
        var x = 10;
        console.log(x); 
    })();

    This will print out undefined and 10 rather than 5 and 10 since JavaScript always moves variable declarations (not initializations) to the top of the scope, making the code equivalent to:

    var x = 5;
    
    (function () {
        var x;
        console.log(x);
        x = 10;
        console.log(x); 
    })();
  9. Catch clause-scoped variable

    var e = 5;
    console.log(e);
    try {
        throw 6;
    } catch (e) {
        console.log(e);
    }
    console.log(e);

    This will print out 565. Inside the catch clause e shadows global and local variables. But this special scope is only for the caught variable. If you write var f; inside the catch clause, then it's exactly the same as if you had defined it before or after the try-catch block.

  • answered 2 years ago
  • B Butts

Your Answer

    Facebook Share