×
☰ See All Chapters

Typescript let vs var

var

let

Supported in both JavaScript and TypeScript

Supported only in TypeScript

A variable declared with var has function scope

A variable declared with let has block scope

Example:

function example1() {

  var i = 20;

  if (true) {

         var i = 30;

         console.log(i); // Prints 30

  }

  console.log(i); // Prints 30

}

Example:

function example2() {

  if (true) {

         let i = 30;

         console.log(i); // Prints 30

  }

  //console.log(i); // Error cannot access i

}

Repetitive declaration inside function will override the previous declaration

Repetitive declaration inside function will either create a distinct variable or creates error.

var

A variable declared with var has function scope. When declared in a function, the variable can be accessed everywhere in the function.

var example

function example1() {

  var i = 20;

  if (true) {

         var i = 30;

         console.log(i); // Prints 30

  }

  console.log(i); // Prints 30 because value is overridden by inside if block.

}

 

 

function example2() {

  if (true) {

         var i = 30;

         console.log(i); // Prints 30

  }

  console.log(i); // Prints 30

}

 

In this code, i is declared twice: once at the start of the function and once inside the if block. Whatever the place inside function, var will have function scope, which means the variable inside the if block is the same variable outside if block. You can see value of i is printed as 30 which is set inside if block.

let and const

A variable declared with let or const has block scope. When declared inside a if or for loop block, the variable can only be accessed inside that if or for loop block. There's no difference between let and var if a variable is declared outside of a function or just inside a function without inner blocks. The difference becomes apparent when variables are declared inside functions with inner blocks.

let example

function example1() {

  let i = 20;

  if (true) {

         let i = 30;

         console.log(i); // Prints 30 because of var

  }

  console.log(i); // Prints 20 because of var

}

 

function example2() {

  if (true) {

         let i = 30;

         console.log(i); // Prints 30 because of var

  }

  //console.log(i); // Error cannot access i

}

 

If a variable is declared with let or const, the that variable scope will be inside that block. So let variable inside function's block will be distinct from the variable outside of the block. In the below example2( ) function when we tried to print i variable whoes scope is limited inside if block, we got the error.

typescript-let-vs-var-0
 

With respect to scope, const is similar to let. The difference between the two is that, if a variable is declared with const, its value is expected to remain constant throughout the block. Any attempt to change the variable's value will result in a compiler error. If a variable's value is expected to change within a block, it should be declared with let instead.

typescript-let-vs-var-1
 

                   


All Chapters
Author