CodePark/ questions / Basics & inference
START PRACTICINGPRACTICE
Frontend question · TypeScript › Basics & inference

How does TypeScript infer types, and what is literal widening? Explain the difference between let and const here, and what as const does.

let a = "dark";        // string
const b = "dark";      // "dark"
const obj = { mode: "dark" };           // { mode: string }
const fixed = { mode: "dark" } as const; // { readonly mode: "dark" }

TypeScript reads the value you assign and uses its type, so most local variables need no type annotation. This is called inference.

When the value is a literal like "dark", TypeScript must choose how specific the type should be. Making it general is called widening:

  • A let can be reassigned later. So let a = "dark" is widened to string.
  • A const primitive can never change. So const b = "dark" keeps the literal type "dark".
  • Object properties and array elements can still change, even inside a const object. So they are widened too: { mode: "dark" } becomes { mode: string }.

as const turns widening off for the whole expression. It does three things:

  • Every literal keeps its literal type.
  • Object properties become readonly.
  • Arrays become readonly tuples (fixed-length arrays where each position has its own type).

It is useful for config objects and lookup tables. It also lets you build a union type from a list of values.

  • TypeScript infers a type from the assigned value, so most local variables need no annotation.
  • Add annotations at function boundaries, like parameters, not on every local variable.
  • let widens a literal like "dark" to string or number.
  • A const primitive keeps its literal type, like "dark".
  • Object properties and array elements are widened, even inside a const object.
  • as const keeps literal types and makes everything readonly. Arrays become readonly tuples.