Open In App
Related Articles

JavaScript Variables

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Report issue
Report

JavaScript Variables are the building blocks of any programming language. In JavaScript, variables can be used to store reusable values. The values of the variables are allocated using the assignment operator(“=”).

JavaScript Identifiers

JavaScript variables must have unique names. These names are called Identifiers.

There are some basic rules to declare a variable in JavaScript:

  • These are case-sensitive
  • Can only begin with a letter, underscore(“_”) or “$” symbol
  • It can contain letters, numbers, underscore, or “$” symbol
  • A variable name cannot be a reserved keyword.

JavaScript is a dynamically typed language so the type of variables is decided at runtime. Therefore there is no need to explicitly define the type of a variable. We can declare variables in JavaScript in three ways:

Note: In JavaScript, variables can be declared automatically.

Syntax:

var geek = "Hello Geek"         // Declaration using var
let $ = "Welcome" // Declaration using let
const _example = "Gfg" // Declaration using const

All three keywords do the basic task of declaring a variable but with some differences Initially, all the variables in JavaScript were written using the var keyword but in ES6 the keywords let and const were introduced.

Example 1: In this example, we will declare variables using var.

Javascript

var a = "Hello Geeks"
var b = 10;
var c = 12;
var d = b + c;
 
console.log(a);
console.log(b);
console.log(c);
console.log(d);

                    

Output:

Hello Geeks
10
12
22

Example 2: In this example, we will declare variables using let.

Javascript

let a = "Hello learners"
let b = "joining";
let c = " 12";
let d = b + c;
 
console.log(a);
console.log(b);
console.log(c);
console.log(d);

                    

Output
Hello learners
joining
 12
joining 12

To learn more about JavaScript let check this article JavaScript Let

Example 3: In this example, we will declare the variable using the const keyword.

Javascript

const a = "Hello learners"
console.log(a);
 
const b = 400;
console.log(b);
 
const c = "12";
console.log(c);
// Can not change a value for a constant
c = "new"
console.log(c)

                    

Output:

Explanation: const keyword is used when we assign a value permanently to a variable. So when we try to change the value of a variable declared with the const keyword it will throw an error. The variables declared with var and let are mutable that is their value can be changed but variables declared using const are immutable. 

To learn more about JavaScript const check this article JavaScript Const

Note: The newly introduced keywords let and const are block scoped whereas var is function scoped. 

Let us see an example to understand the difference:

Example: In this example, we are trying to access the block scoped variables outside the block that’s why we are getting error.

Javascript

{
    let a = 2;
    var b = 4;
    const c = "Hello";
    console.log(a);
    console.log(b);
    console.log(c);
}
 
console.log(b);
console.log(c);
console.log(a);

                    

Output:

Explanation: Since variables “a” and “c” are block scoped so we were not able to access them outside their block.

When to Use var, let, or const

  • We declare variables using const if the value should not be changed
  • We use const if the type of the variables should not be changed such as working with Arrays and objects
  • We should use let if not using const

To learn more about the scope of variables refer to this article Understanding variable scopes in JavaScript

Comparison of properties of let, var, and const keywords in JavaScript:

Property

var

let

const

ScopeFunction scopedBlock scopedBlock scoped
UpdationMutableMutableImmutable
RedeclarationCan be redeclaredCannot be redeclaredCannot be redeclared
HoistingHoisted at topHoisted at topHoisted at top
OriginsPre ES2015ES2015(ES6)ES2015(ES6)
SupportSupported in the old version of BrowserNot supported in the old version of the BrowserNot supported in the old version of the Browser


Last Updated : 23 Nov, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads