Ways to break JavaScript Scope

Question

JavaScript normally follows the function scope i.e. variables are accessible only within the function in which they are declared.

One of the ways to break this convention and make the variable accessible outside the function scope is to use the global window object e.g.

window.myVar = 123;

My question is are there any other ways in JavaScript/jQuery to make the variable accessible outside the function scope?

Basically, every variable declared with `var` is local. If you omit it, you will set the value of a variable in a higher scope (global or not) or make it global if it doesn't exist. — Felix Kling, Jul 25 '13 at 07:37
I don't fully understand your question. can't you just declare a global variable? — yaoxing, Jul 25 '13 at 07:37
you can check this question http://stackoverflow.com/questions/500431/javascript-variable-scope?rq=1 — Phong Vo, Jul 25 '13 at 07:41
What's your purpose? Because there are several way to do it. The question would be what is the best/elegant way to do it in one specific case. — Luca Rainone, Jul 25 '13 at 07:42
I am just trying to understand the different ways of making a variable which is "within" the function "accessible outside" — copenndthagen, Jul 25 '13 at 08:31

score 6 · Answer 1 · answered Jul 25 '13 at 07:36

Not with variable declarations, no. You can obviously declare a variable in an outer scope so that it's accessible to all descendant scopes:

var a; // Available globally
function example() {
    a = "hello"; // References a in outer scope
}

If you're not in strict mode you can simply remove the var keyword. This is equivalent to your example:

// a has not been declared in an ancestor scope
function example() {
    a = "hello"; // a is now a property of the global object
}

But this is very bad practice. It will throw a reference error if the function runs in strict mode:

function example() {
    "use strict";
    a = "hello"; // ReferenceError: a is not defined
}

score 0 · Answer 2 · answered Jul 25 '13 at 07:39

As you wrote, variables are only visible inside the function in which they were defined (unless they are global).

What you can do is assign variables to the function object itself:

function foo() {
    foo.myVar = 42;
}

console.log(foo.myVar); // outputs "undefined"
foo();
console.log(foo.myVar); // outputs "42"

But I would advise against it. You should really have a very good reason to do something like this.

score 0 · Answer 3 · answered Jul 25 '13 at 07:45

You can define them as part of a global object, then add variables later

// Define your global object
var myObj = {};
// Add property (variable) to it
myObj.myVar = 'Hello world';
// Add method to it
myObj.myFunctions = function() {
    // Do cool stuff
};

See the link below:

Variable declaration

Also, you can declare it without the var keyword. However, this may not be a good practice as it pollutes the global namespace. (Make sure strict mode is not on).

Edit: I didn't see the other comments before posting. @JamesAllardice answer is also good.

Ways to break JavaScript Scope

3 Answers3