Your Complete Guide on the Scope of Variables in JavaScript

Every programming language in today's world has the concept of variables. Variables are used to store values (number, string, boolean) that can change at any point in time. But, did you ever notice that these variables always have a scope, and you can't use them outside of that scope? In this tutorial, you will explore the Scope of Variables in JavaScript.

Understanding Variables in JavaScript

Variables in JavaScript work differently from other languages. Here, you don't have to specify the type of variable you are using. Unlike other programming languages, you don't have different data types for different types of values. 

  • You can use var, const, and let keyword to declare a variable, and JavaScript will automatically determine the type of this variable according to the value passed. 

Variables_in_Javacript_1.

So, this was a brief introduction to Variables in JavaScript. In the next section, you will go through the Scope of Variables in JavaScript.

Full Stack Java Developer Course

The Gateway to Master Web DevelopmentExplore Course
Full Stack Java Developer Course

What is the Scope of Variables in Javascript?

Scope of variables refers to the accessibility of a particular variable within the program. 

For example, assume you have two different functions. First, you declare a variable in function 1. Then, you move on to the following function, i.e., function 2. Is it possible if you try to access the variable made in function 1 from function 2? This refers to the Scope of a Variable in JavaScript.

Variables_in_Javacript_2.

 JavaScript variables have different scopes, they are:

  • Global Scope
  • Local Scope 
  • Block Scope
  • Function Scope

Have a look at the different Scopes in detail.

What is Global Scope?

  • Any variable declared outside of a function is said to have Global Scope.
  • In simple terms, a variable that can be accessed anywhere in the program is known as a variable with global scope. Globally scoped variables can be defined using any of the three keywords: let, const, and var. 

Variables_in_Javacript_3

What is Local Scope?

  • Any variable that you declare inside a function is said to have Local Scope. You can access a local variable can within a function. If you try to access any variable defined inside a function from outside or another function, it throws an error.

Variables_in_Javacript_4.

  • Since you cannot access a local variable from outside the function, you can have a variable of the same name in another function as well.

Variables_in_Javacript_5

What is Block Scope?

  • Before introducing ES6 (ECMAScript 6) in 2015, JavaScript had only two types of scopes: Global Scope and Local Scope. 
  • With the introduction of let and const keywords, it added a new type of Scope in JavaScript. You cannot access the variables declared inside a particular block (represented by {}) from outside the block. 

Variables_in_Javacript_6.

  • The block scope does not work with the var keyword. You can either use let or const keywords for that.

Variables_in_Javacript_7

What is Function Scope?

  • With the creation of each new function, it creates a new scope in JavaScript. You cannot access variables defined inside a function from outside the function or from another function. Var, let, and const work similarly when used inside a function. 

Variables_in_Javacript_8.

Free Course: JavaScript for Beginners

Learn the Basics of JavaScriptEnroll Now
Free Course: JavaScript for Beginners

JavaScript Strict Mode for Defining Scope of a Variable 

In JavaScript, if you forget to declare a variable with a keyword: var, let, and const, JavaScript automatically takes it as a global variable, and you can access it anywhere in the program. 

Variables_in_Javacript_9

To avoid such mistakes and confusion, the strict mode was introduced in JavaScript with ES5 (ECMAScript 5) in the year 2009.

  • Strict mode will throw an error if you try to use the same syntax after including "strict mode" in your program. It will help you in writing cleaner and more secure code.

Variables_in_Javacript_10

  • Just like variables, strict mode too can be used either globally or locally. If you write "use strict" at the program's start, it will be used globally. Otherwise, you can also use strict mode locally inside a function.

Variables_in_Javacript_11.

  • All the modern browsers support Strict mode, except internet explorer 9 and its previous versions.

Variables_in_Javacript_12

Life of a Variable in JavaScript

The lifespan of a variable in JavaScript depends upon the scope of that variable. It starts when it declares the variable.

  • A local variable lives until the function is under execution. The moment a function completes, the local variable gets deleted.
  • A Global variable lives until the user closes the program or until the web browser is closed. However, if the user changes the window without closing the program, the global variable remains there. 

With this, you have reached the end of this "Scope of Variables in JavaScript" tutorial.

Master the complete JavaScript fundamentals, jQuery, Ajax, and more with the Javascript Certification Training Course. Check out the course preview!

Conclusion 

In this tutorial, you explored The Scope of Variables in JavaScript. The Scope depends on two aspects:

  • Where the variable declared
  • How the variable declared

You also went through the need and usage of "strict mode" in JavaScript. Following this, you also understood how long a variable would be present for you while programming. You also encountered the coding implementation and need to understand the Scope of a Variable present in JavaScript.

Are you interested in expanding your knowledge of JavaScript or are looking for online training in JavaScript programming?

If the answer is yes to either or both the above questions, the JavaScript certification course offered by Simplilearn is something you should explore. This applied training program is designed to help you grasp the concepts of JavaScript from basics to advanced levels.

On that note, if you have any doubts related to this tutorial on Scope of Variables in JavaScript, don't hesitate to place them as comments at the end of this page; we will respond to them soon!

About the Author

SimplilearnSimplilearn

Simplilearn is one of the world’s leading providers of online training for Digital Marketing, Cloud Computing, Project Management, Data Science, IT, Software Development, and many other emerging technologies.

View More
  • Disclaimer
  • PMP, PMI, PMBOK, CAPM, PgMP, PfMP, ACP, PBA, RMP, SP, and OPM3 are registered marks of the Project Management Institute, Inc.