Variable Declaration in Javascript for Beginners

Variables in JavaScript are like containers that hold reusable data. These data containers need to be declared with some specific keywords in Javascript.

Right now there are 3 ways to declare a keyword in JavaScript:

1. var (older/outdated way)
2. let (introduced in ES6 ✨)
3. const (introduced in ES6 ✨)

Before the standardization of ES6 (ES2015), everyone used to declare variables with the var keyword. Now we have let and const for every possible case.

Rules for using const and let

Follow these two rules to decide:

1. Use const as a constant when you are sure that the variable will not be redeclared.
2. Use let for everything else.

Rules for naming variables

Variable names are case sensitive, so name and Name both will be considered different variables.

let name = 'Pankaj'; let Name = 'Batman'; console.log(name); // 'Pankaj' console.log(Name); // 'Batman' 

Variable names cannot begin with a number but the numbers can be used in the middle and end of the variable name.

let 1name; // ❌ invalid var 1name; // ❌ invalid const 1name; // ❌ invalid let name1; // ✔ valid var name1; // ✔ valid let my1name; // ✔ valid const name1; // ❌ invalid const name1 = 'Pankaj' // ✔ valid 

A variable declared with const must be initialized.

// ❌ invalid const name; // SyntaxError: missing initializer // ✔ valid const name = 'Pankaj'; 

Variables can start, end, or contain the following:

1. Uppercase strings
2. Lowercase strings
3. Underscores _
4. Dollar sign $

let _name; // ✔ valid var $name; // ✔ valid const my_name; // ✔ valid let my$name; // ✔ valid 

Variables cannot start, end, or contain symbols and special characters:

let my@name; // ❌ invalid const #name; // ❌ invalid var my%name; // ❌ invalid let -name; // ❌ invalid const my^name; // ❌ invalid var *name; // ❌ invalid 

Multiple variables can be chained by comma, but it's not considered good practice to do this.

let x, y, z; // ✔ valid var x, y, z; // ✔ valid const x, y, z; // ❌ invalid // ✔ valid with let, const and var let x = 1, y = 2, z = 3; const a = 1, b = 2, c = 3; 

Subsequent declaration of a variable is possible with var but not with let and const.

// ✔ valid var age = 80; var age = 81; console.log(age) // 81 // ❌ invalid for let and const let age = 80; let age = 81; // SyntaxError: Identifier 'age' has already been declared // ✔ valid for var and let let age = 80; age = 81; console.log(age) // 81 // ❌ invalid for const const name = 'Hulk'; name = 'Thor'; // Uncaught TypeError: Assignment to constant variable. // ✔ valid for let, var, and const if the variable is an object/array const hero = {}; hero.name = 'Thor'; // ✔ const hero = { name: 'Hulk' }; hero.name = 'Thor'; // ✔ 

Notice in the above last example that we are just modifying one of the keys in the object and not replacing the entire object so it's working perfectly fine.

Why should we prefer let and const over var

It is good practice to avoid using var declaration in your code. let was introduced to provide a level of organization while managing the large data structures as it is safer knowing that your variable cannot be reassigned anywhere in its scope.

A quick tip

End all your statements with a semicolon. Although, JavaScript will do it for you when reading your code. But as a general guideline, we should always terminate each statement with a semicolon.

Thanks for reading! 🎉