In this tutorial we will see the basic concept of JavaScript Variable. This article will only focus on JavaScript variables. Known as the language of the web, JavaScript is one of the finest programming languages.

Definition

JavaScript variables are used to store information in containers. It can be used to store any type of value including string, number, array, boolean, etc. Every value that you store in JavaScript uses a name (known as variable name) for storing and referencing purposes.
For Example :

  var website = "Geeks Trick | Code In A Tricky Way";
   // 'website' Is A Variable Name

To understand how variable works, we need to understand three important terms:

• Declaration
• Initialization
• Assignment

It doesn’t matter which programming language you are using, the concept of how variables are created and assigned will help you understand higher concepts in depth.

Declaring The Type

Like many other programming languages, JavaScript has variables. Variables can be thought of as named containers. You can place data into these containers and then refer to the data simply by naming the container.

Before you use a variable in a JavaScript program, you must declare it. Variables are declared with the var keyword as follows.

  var website;
  var description;

You can also declare multiple variables with the same var keyword as follows:

  var website, description;

Initializing A JavaScript Variables

Variable initialization automatically happens after you declare a variable. When initializing, memory is allocated by the JavaScript engine allowing you to assign value to it.

// this is declaring and initializing with undefined
  var example; 

Assigning A Value

The last step comprises of assignment and is done when a value is set.

So how to declare variable type in JavaScript?

Declaring variable is very easy. There are already available constructs you need to use to declare a variable.

VAR

var is the most used way of declaring a variable. The below code explains how to do it.

var webSite; // declaring and initializing a variable.
webSite = "Geeks Trick | Code In A Tricky Way"; // Assigning a variable.

Alternatively, you can use the below code to do the declaration, initialization, and assignment in a single line of code.

var webSite = "Geeks Trick | Code In A Tricky Way";

Note: When you declare a variable inside a function, its scope is related to the function itself. If you declare a variable outside the function, it has a global scope. We will cover it in the later part of the guide.

Cover Out In Deep From HERE

const Javascript Variables

const is made available from ES6(ES2015) specification.

const is a used to assign a value to a variable once, and it always works at the block level. This means that its scope is bound to the block level. So, what are the use case of const?

const can be used when you are working with an iterator or when you want to declare a value once. However, const is not a solution to declare immutable variables. It works in a different way. It ensures that the reference is immutable, but doesn’t do the same for the value. This means that the value can be changed, but re-assignment cannot be done with const.

Let us see an example :

function example() {
 const x = "y"
 if (true) {
  const x // variable not assigned, SyntaxError 
  const x = "b"
  foo = "z" // variable cannot be re-assigned, SyntaxError
  console.log(x) 
  // b as const is available in this scope
 }
 console.log(x)
 // y as const is available to the higher scope.
}

Cover Out In Deep From HERE

let Javascript Variables

let allows you to declare variables that are limited in scope to the block, statement, or expression on which it is used. This is unlike the var keyword, which defines a variable globally, or locally to an entire function regardless of block scope.

Scoping rules

Variables declared by let have as their scope the block in which they are defined, as well as in any contained sub-blocks. In this way, let works very much like var. The main difference is that the scope of a var variable is the entire enclosing function:

function varTest() {
  var x = 1;
  if (true) {
    var x = 2;  // same variable!
    alert(x);  // 2
  }
  alert(x);  // 2
}

function letTest() {
  let x = 1;
  if (true) {
    let x = 2;  // different variable
    console.log(x);  // 2
  }
  console.log(x);  // 1
}

Cover Out In Deep From HERE

Learned Concept

Things to learn from the different ways of declaring variables are as follows:

1. const is great for local variable initialization, especially in iterators.
2. let can be used in place to var if you know what you are doing.
3. let is good for working with block level control. For example, you can use it while iterating a loop. This way you won’t have to worry about similarly named variables used previously.

Get More Post On JavaScript