const vs let vs var in JavaScript

6 min readAug 17, 2020

Let try to understand different types of variable available in JavaScript. We will start from the old school variable declaration to the latest ES6 (ES 2015) variable which is new and has more flexibility over `var`.

So this is all level but I will try from a basic so if any new to the world of programming or JavaScript can take lots from here.

So what is variable?

So if you google it what is variable you will find a lot of definition on the variable.

Let try to understand in layman language. In the field of programming, Variables are the names you give to computer memory locations which are used to store values in a computer program. It is similar to our University library where the books are store in different sections based on their categories. In Programming, we used to store data in computer memory and these memories are also categories with different uses. So some memory is available for storing & running program. we will not go it deep just stick on basic definitions.

So different programming language has a different way of defining variable & work upon them. In JavaScript, we have 3 types of variables used to store the expression & use them.

JS in Dynamically Typed Programming Language (A Variable Doesn’t Enforce the type). The variable in JS does not have any attached.

In C language if we have to define variable we have stated their type.

int a, b; // Here int used to state a variable is of type interger.
float f; // Here float used to state a variable if of type float or decimal

JS is both dynamically typed and weakly typed.

Defining a Variable in JavaScript

As above I said we don’t have to state type in JS. So we can define a variable using any of the following keywords const, let , & var.

const PI = 3.14;
let user = "itz me"
var isActive = true;

In the above, we declared a variable using all available options and I don’t have to say what type of data is that. So we can declare a variable using any of these but there is a difference in them and you will find what to use and when to use after this.

var -

Before the release of ES6 specification, we had only one way to initialize a variable in JavaScript using a var keyword. To define a variable using var we had to use keyword var and after that variable name.

var user; // Initialize a variable using var and name it user

Here we initialize and variable and didn’t give any value by default all variable without value has a default value of undefined.

variable defined using var is functional scope means that if we defined a variable inside a function it will available to that function.

Variable created using var outside a function are global scoped (A scope in any programming is a region of the program where a defined variable can have its existence and beyond that variable, it cannot be accessed). Mean that globally created variable using can be used and update anywhere in the program.

var in function

Here we defined a variable named user in the global scope with the value of global and another variable with the same name in the function scope if we see console message when we call scope() function in there a new scope created which is also known as the functional scope and there we assign a value “function scope” in when it reaches to line 5 it prints function scope on a REPL or console and get out of functional context and run then line 9 here we can see that the value of a user is still global in the global context. So variable created using var is functional scope.

Another difference is that using var if you created a variable with the same name in the global or function context it will get overwritten by the last value of that variable

we can see it get updated with the new value. Nowadays people try to avoid using var and use ES6 latest way for defining a variable with more flexibility and other features.

As above we see a kind of disadvantage of using var suppose you are collaborating with other developers and both of you defined using same name then it will break your program. So avoid using var.

let -

let & const is a new addition on ES6 to defining variable which has a more secure way of defining a variable.

To define a variable using let we use let keyword

let user = "itz me";

let and const both are block-scoped. we saw var is functional scoped and variable defined using var inside a function is in function context but let & const are block-scoped (a block in JavaScript is anything in between { }).

Let see with Example

Above we created a variable using let in a global context if block and function block. As this program run it comes to first to if block and run it and here we defined a user using let with a value inside if that gets printed on console then it reached to line 8 and here function gets called and moved to lined 8 here we redefined a variable using let with a value inside function that gets printed on the console you can see as the function is also block-scope because the block is anything is inside curly braces {}. In last our JS run line 15 and print global to console. As see our globally defined variable using let not get updated by if block and function block.

Similarly const is also block-scoped .

Let see what happens if we redefined a variable in a global context or block context.

If we try to run this we can see it will throw an error ( if you try to copy and pasting on the browser that may not throw and error try creating a js file)

Uncaught SyntaxError: Identifier 'userName' has already been declared

You had seen power of let & will not create an issue in collaborating. if we had issue of redefining with the same name we will get an error and also save debugging time.

const -

The only difference in let and const is that variable created using const can’t be reassigned with the new value. Here const means constant.

Everything is similarly to let .

There is more with variable and JavaScript Hoisting I will cover it next blog.

Follow Me Medium — Kushal

Follow Me on Twitter — ikushaldave