Skip to main content Accessibility Feedback

Keeping your JavaScript out of the global scope (and why you want to)

This week, we learned about JavaScript scope, and how to define and update variables across different types of scope.

There are times you may want to expose a function or variable to the global scope (for example, a lightweight framework you want other scripts to be able to use).

But generally speaking, you want to keep your functions and variables out of the global scope. Otherwise, if another script or developer defines a variable or function that has the same name as the ones in your script, it will override them or introduce conflicts.

You can move your code into a lexical scope by wrapping it in a function.

// Wrapper for your code
var myScripts = function () {
    // Your codes goes here...
};

// Run your scripts
myScripts();

If you want your code to run immediately when the file runs without having to call your function, you can use something called an Immediately Invoked Function Expression (or IIFE). An IIFE is an anonymous (as in, unnamed) function that runs immediately.

;(function (window, document, undefined) {
    // Your code goes here...
})(window, document);

Use one of these two techniques to make your code less fragile.


🚀 Make 2018 the year you master JavaScript! My pocket guides and mini courses are short, focused, and made for beginners. You can do this!

Have any questions or comments about this post? Email me at chris@gomakethings.com or contact me on Twitter at @ChrisFerdinandi.

Get Daily Developer Tips