Previous

Literal Types in TypeScript

Literal types in TypeScript allow you to specify exact values a variable or function parameter can have, rather than just a broad type. These types provide more specificity and are useful for enforcing strict value constraints, ensuring that the value of a variable or parameter can only be one of a predefined set of specific values.

 

Key Concepts of Literal Types

  • Literal Types are used to define exact values that a variable can hold.
  • String Literal Types: A specific string value (e.g., 'apple').
  • Numeric Literal Types: A specific number value (e.g., 42).
  • Boolean Literal Types: A literal value of true or false.

 

Example Usage of Literal Types

Example 1: String Literal Types

type Fruit = "apple" | "orange" | "banana";

let myFruit: Fruit;

myFruit = "apple";  // valid
myFruit = "grape";  // Error: Type '"grape"' is not assignable to type 'Fruit'.

In this example:

  • The Fruit type can only be one of the specific string values: "apple", "orange", or "banana".
  • Attempting to assign a value outside this set, such as "grape", results in a compile-time error.

Example 2: Numeric Literal Types

type Age = 25 | 30 | 35;

let personAge: Age;

personAge = 25;  // valid
personAge = 40;  // Error: Type '40' is not assignable to type 'Age'.

Here, the Age type is restricted to one of the specified numeric values: 25, 30, or 35. Assigning any other number, such as 40, causes a type error.

Example 3: Boolean Literal Types

type IsActive = true | false;

let isActive: IsActive;

isActive = true;   // valid
isActive = false;  // valid
isActive = "yes";  // Error: Type '"yes"' is not assignable to type 'IsActive'.

For the IsActive type, only true or false are valid. Any other value would cause a compile-time error.

 

Literal Types in Function Parameters

Literal types are often used to restrict the values of function parameters to specific values.

function greet(message: "hello" | "hi") {
  console.log(message);
}

greet("hello");  // valid
greet("hi");     // valid
greet("goodbye");  // Error: Argument of type '"goodbye"' is not assignable to parameter of type '"hello" | "hi"'.

In this example, the greet function accepts only the string literals "hello" or "hi". Attempting to pass any other string, like "goodbye", will result in a compile-time error.

 

Literal Types with Union Types

You can combine literal types with union types to create more complex constraints.

type Status = "pending" | "approved" | "rejected";
type UserAction = "save" | "edit" | "delete";

type ActionStatus = Status & UserAction;  // Invalid because intersection of two string literals doesn't make sense

let status: Status = "approved";  // valid
let action: UserAction = "save";  // valid

Here, combining Status and UserAction results in an error because it doesn't make logical sense for a status and an action to be intersected. However, union types are valid and work as intended.

 

Literal Types and Type Narrowing

Literal types can be used for narrowing types, particularly in conditional structures like if statements.

type UserRole = "admin" | "user";

function checkRole(role: UserRole) {
  if (role === "admin") {
    console.log("Admin role detected");
  } else {
    console.log("User role detected");
  }
}

checkRole("admin");  // Admin role detected
checkRole("user");   // User role detected

Here, TypeScript narrows the type of role to either "admin" or "user" based on the conditional check, allowing for precise type-checking and safer code.

 

Combining Literal Types with Other Types

Literal types can also be combined with other types, such as string, number, or boolean, to create more complex type constraints.

type PersonStatus = "active" | "inactive";
type User = {
  name: string;
  status: PersonStatus;
};

const user: User = {
  name: "John",
  status: "active",  // valid
};

In this example, the status property of the User object is constrained to either "active" or "inactive". The name property is a regular string.

 

Literal Types with Arrays

You can use literal types with arrays to restrict the allowed values of array elements.

type Colors = ["red", "green", "blue"];

let colorArray: Colors = ["red", "green", "blue"]; // valid
colorArray = ["yellow", "blue", "red"];  // Error: Type '["yellow", "blue", "red"]' is not assignable to type '["red", "green", "blue"]'.

In this case, the colorArray must exactly match the specified array of colors. Any deviation from the allowed literal values will cause an error.

 

Summary

  • Literal Types allow you to define exact values for variables or function parameters.
  • These types can be used with strings, numbers, and booleans to enforce stricter value constraints.
  • They are helpful for narrowing types, creating more precise function signatures, and improving type safety in TypeScript.
  • Literal types are particularly useful when you want to enforce strict validation on specific values or choices.
Previous