TutorialsArena

A Guide to Variable Declarations in TypeScript: var, let, and const

Learn about variable declarations in TypeScript, including the var, let, and const keywords. Understand their scopes and uses, and discover why let and const are preferred over var for better code safety and clarity.

TypeScript Variables: var, let, and const

Understanding Variable Declarations in TypeScript

TypeScript, being a superset of JavaScript, inherits the variable declaration methods from its parent language. However, it introduces refinements and additional features to enhance type safety and code reliability.

var Keyword

Similar to JavaScript, var is used to declare variables in TypeScript. However, due to its function-scoped nature, it's generally discouraged in favor of let and const.

let Keyword

The let keyword introduces block-scoped variables, meaning their scope is limited to the enclosing block (e.g., function, loop, or conditional). This helps prevent accidental variable overwrites and improves code clarity.

Example

function demo() {
  let message = "Hello"; // Block-scoped variable

  if (true) {
    let message = "World"; // Different variable in a different scope
    console.log(message); // Output: World
  }

  console.log(message); // Output: Hello
}

const Keyword

The const keyword declares variables whose values cannot be reassigned after initialization. This promotes immutability and helps prevent accidental modifications.

Example

const PI = 3.14159;
// PI = 3.14; // Error: Cannot assign to 'PI' because it is a constant or a read-only property

Note that while the value of a const variable cannot be changed, the properties of objects assigned to const variables can be modified:

Example

const person = {
  name: "John Doe",
  age: 30
};
person.age = 31; // Valid
person = { name: "Jane Doe" }; // Error: Cannot assign to 'person' because it is a constant

Key Differences and Best Practices

Feature var let const
Scope Function-scoped Block-scoped Block-scoped
Reassignment Allowed Allowed Not allowed
Hoisting Hoisted to the top of the function Not hoisted Not hoisted
Declaration before use Allowed Not allowed (temporal dead zone) Not allowed

Best Practices

  • Prefer let and const over var for modern TypeScript code.
  • Use const whenever possible to enforce immutability.
  • Use let for variables that need to be reassigned within a block.

By understanding the nuances of var, let, and const, you can write cleaner, more reliable, and maintainable TypeScript code.