What are the different keywords to declare variables in TypeScript ?

Typescript variable declarations are similar to Javascript. Each keyword has a specific scope. Let’s learn about variable declarations in this article. In Typescript variables can be declared by using the following keywords:

• var
• let 
• const

Var keyword: Declaring a variable using the var keyword.

var variable : number = 1;

The var variables have function scope. It indicates they’re only available within the function they were formed in, or they’re globally scoped if they weren’t generated within a function. It won’t work if I declare var inside a function and then try to call it from outside the function.

The number1 is a number that is globally declared. The number2 has the scope of the function it resides in. The number3, even if it’s declared in an if loop, it can be accessed in the function as it’s declared with the var keyword.

Javascript

var number1: number = 1;

function var_keyword() {
  var number2: number = 2;
  if (number1 + number2 == 3) {
    var number3: number = 3;
  }

  console.log(number1);
  console.log(number2);
  console.log(number3);
}

var_keyword();

Output:

1
2
3

Let keyword: Declaring a variable using the let keyword. 

let variable : string = "geeksforgeeks";

The let variables are block-scoped. Unlike the var keyword, which declares a variable globally to the whole function regardless of block scope, the let keyword allows you to define variables that are confined to the scope of the block statement or expression on which it is used. 

The number1 is a number that is globally declared. The number2 has the scope of the function it resides in. The number3 is declared in an if loop, it can be accessed only in the if loop, it’s block-scoped as it’s declared using the let keyword.

Javascript

let number1: number = 1;

function let_keyword() {
  let number2: number = 2;
  if (number1 + number2 == 3) {
    let number3: number = 3;
  }

  console.log(number1);
  console.log(number2);
  console.log(number3); // Throws error
}

let_keyword();

Output: After compiling the ts file the output is:

error TS2552: Cannot find name 'number3'. Did you mean 'number2'?
console.log(number3); // Throws error

After running the js file:

1
2
3

Advantages of let keyword over var keyword:

Variables which are declared with the keyword let cannot be accessed before declaration, error gets raised while in the same condition var variables give undefined as result. 

Javascript

console.log(number1); // undefined
var number1: number = 1;

console.log(number2); // Throws error
let number2: number = 2;

Output:

error TS2448: Block-scoped variable 'number2' used before its declaration.
   console.log(number2);  

Variable declared using let cannot be re-declared.

Javascript

let student_name: string = "rachel";
let student_name: string = "john"; // Throws error

Output:

error TS2451: Cannot redeclare block-scoped variable 'student_name'.
   let student_name: string = "john";

Const keyword: Declaring a variable using the const keyword. 

const variable : number = 9;

The const variables are block scoped. Constants, like variables declared with the let keyword, are block-scoped. A constant’s value cannot be modified by reassigning a new value to it and the variable with the same name cannot be redeclared either. 

The number1 is a number that is globally declared. The number2 has the scope of the function it resides in. The number3 is declared in an if loop, it can be accessed only in the if loop, it’s block-scoped as it’s declared using the const keyword. the const keyword is similar to let but the difference is that const variables can’t be reassigned, variables declared using let can be reassigned. 

Javascript

const number1: number = 1;

function const_keyword() {
  const number2: number = 2;
  if (number1 + number2 == 3) {
    const number3: number = 3;
  }

  console.log(number1);
  console.log(number2);
  console.log(number3); // Throws error
}

const_keyword();

Output: After compiling the ts file the output is:

error TS2552: Cannot find name 'number3'. Did you mean 'number2'?
     console.log(number3); //error

After running the js file:

1
2
3

Variables declared using const type cannot be reassigned or redeclared

Example: Following example demonstrates that the variable can not be reassigned.

Javascript

// Variable cannot be reassigned
const student_name: string = "rachel";
student_name = "john";

Output:

error TS2588: Cannot assign to 'student_name' because it is a constant.
    student_name = "john";
    ~~~~~~~~~~~~

Example: Following example demonstrates that can not redeclare variables.

Javascript

// Can not redeclare variables
const student_name: string = "rachel";
const student_name: string = "john";

Output:

error TS2451: Cannot redeclare block-scoped variable 'student_name'.
    const student_name: string = "john";