Javascript - Where to put Constants, Global or Local?

Question

I'm new to javascript, trying to understand global and local variables. I keep hearing "Avoid global variables". I have a bunch of string variables that are only used in one function, so it I should make them local, right? I never need to change there value, so I was wondering... Every time I call the function, does that mean all those variables get set again and again, to the same value. Does it take javascript any time or effort to set these variables over and over again? Is there are better way to handle variables that you know will never change value. Here's what I'm getting at...

function test() {
var a="the quick brown fox blah blah blah...";
var b="Hello world blah blah blah....";
var c...
var d.... etc, etc....
<more code goes here>
}

To me it looks like every time I call test() all the variables get set again. If I put them outside the function wouldn't they only get set once? But that would make them global, right?

When resolving a variable, javascript starts at the innermost scope and searches outwards. — Rahul Tripathi, Apr 07 '15 at 18:53

score 4 · Answer 1 · answered Apr 07 '15 at 18:50

4

Not that it would really make a difference performance-wise, but you could keep them out of global scope but still only define them once:

(function() {
    var a = "a";
    var b = "b";
    window.test = function() {
        console.log(a);
    };
})();

answered Apr 07 '15 at 18:50

Joe Enos

39,478
11
80
136

Your solution is nice but based on the question this level of answer will be overwhelming for the OP. – roxan Apr 07 '15 at 18:55

mwcz · Answer 2 · 2015-04-07T19:41:48.430

0

You're right, those variables will be set each time you call the test function, so moving them outside of the function is a good idea (there may be some interpreter optimizations that prevent any performance penalties, but I still think its a good idea for code readability).

The best solution is to wrap all your code in an immediately-invoked function expression (IIFE), like so:

(function main() {

    var a="the quick brown fox blah blah blah...";
    var b="Hello world blah blah blah....";
    var c...
    var d.... etc, etc....

    function test() {
        <more code goes here>
    }

    // call test() many times

}());

edited Apr 07 '15 at 19:41

answered Apr 07 '15 at 18:52

mwcz

8,949
10
42
63

1

This is just creating a function, but not calling it. For it to be an IIFE you need to call it (e.g. `(function () {})();` instead of `(function () {});`) – redbmk Apr 07 '15 at 19:10

Catalin MUNTEANU · Answer 3 · 2015-04-07T19:03:56.170

You can have as many variables are you want. I doubt you'll ever create so many variables that it could impact your application performance.

What you should always have in mind is the clarity of your application. The code must be readable.

If you only use a variable in a function then you should also declare it inside that function.

It is recommended that you avoid creating global variables.

This is easily achieved if you wrap your code inside a self invoking function:

(function() {
    var CONSTANTS = {
        key: "VALUE",
        key2: "VALUE2",
    };

    function doSomething() {
        var local_property = "foo";
        console.log(CONSTANTS.key2); // it works
    }
} ());

doSomething(); // error
console.log(CONSTANTS.key); // you won't be able to access it here

I recommend you read the following articles so that you get a better understanding of how JavaScript works:

Variable statement

Closures

Grammar and types

Javascript - Where to put Constants, Global or Local?

3 Answers3