Reading time: 20 minutes | Coding time: 5 minutes

In this article, we will explore everything about variables in JavaScript. In JavaScript, a variable can be declared in 3 ways (var, let, const) and the variable scope depends on this.

Most of the JavaScript syntax are similar to of C, Java or C++. In JavaScript, we declare a variable using the var keyword as follows:

var maxvalue = 20;

var maxValue = 30;

Here maxvalue and maxValue are two different variables because Javascript is case-sensitive.

We use variables to give values a specific definitive name. The variable names are called identifiers.

A javascript identifier must follow certain rules to be a valid variable name -

• An identifier must start with a letter, underscore( _ ) or dollar sign ( $ ).
• An identifier never starts with a number / digit ( 0-9 ) but can consist a number at any place except first one.
• Because of javascript being case-sensitive Uppercase ( A-Z ) & lower case ( a-z ) characters are also included.

opengenus    //valid
OpenGenus    //valid
Open_genus   //valid
opengenus1   //valid
$opengenus   //valid
_opengenus   //valid

@opengenus   //invalid
23opengenus  //invalid

Variable declarations

JavaScript provides us three types of variables declarations:

• var
• let
• const

var

var keyword is used to declare both local and global variables whose scope depends on execution context.

var name = "Dave";

let

let keyword is used to declare local variables at block scope.

let length = 10;

const

const also used similarly as let for block scope variables but for constant values.

Once const is declared and initialized , its value can not be changed. If you try to change( mutate ), it will throw an error.

const PI = 3.14;

PI = 2;

// Uncaught TypeError: Assignment to constant variable.

• if we don't assign any value to the defined variable for var and let, like -

var a;

OR

let num;

then JavaScript automatically assigns them a value of undefined.

console.log(num);
// undefined

• But if we don't assign a value for a const variable then it throws an error because const is immutable and it can be only assigned a value once and on the same line of declaration.

const PI;

// Uncaught SyntaxError: Missing initializer in const declaration

Note -

What will happen if we use a variable without declaring it -

console.log("Value of a =", a);

// ReferenceError: a is not defined

It will throw an error.

What if we declare same variable more than one time.

using var

var a = 10;
var a = 20;

console.log("Value of a = ", a);

// Value of a = 20

You might have expected an error but var rewrites the value. And this is dangerous. So be very careful when working with var because you might redeclare any variable and you program will still run fine with 0 errors and you wont get your desired output.

using let

let a = 10;
let a = 20;
 
console.log("Value of a = ", a);
 
// SyntaxError: Identifier 'a' has already been declared

This time we get an error as expected.

Variable Scope

When you declare a variable outside of any function, it is known as Global variable. But when you declare a variable within a function, it is known as local variable.

There is also a term Block scope which was introduced in ECMA Script 2015 means a variable is fully accessible inside a block { } in which variable was declared. If any function resides in that same block, it can also use that variable.

if (true) {
    var a = 6;
}

console.log(a);

// 6

we get output because variable declared using var have both local and global scope.

if (true) {
    let b = 10;
}

console.log(b);

// ReferenceError: b is not defined.

here, we get an error because b is declared using let, so it's scope resides only between block { }. We can not access b outside.
If a function or another block resides inside a a block and a variable is declared in the first block.Both the inner block and function has access to that variable.

if(true) {
    let val = 10;
    for( let i=1; i<=5; i++ ) {
    val = val + i;
    }
    console.log("value of val = ",val);
    console.log("value if i = ",i);
}

// value of val = 25
// ReferenceError: i is not defined

val is accessible inside for loop and after for loop because we are still inside the block in which val is declared.

But i declared inside for loop is not accessible outside loop because it scopes ends as soon as for loop exits.

With this, you will have the complete knowledge of using variables in JavaScript. Enjoy.