Skip to content
Laviyx Learn

Try

TypeScript course menu

TypeScript Type Aliases: Naming Types with the type Keyword

Learn TypeScript type aliases: naming object types, unions, tuples and function types with type, reusing and composing aliases, readonly and optional properties, generic aliases, and naming conventions.

Intermediate7 min readUpdated
On this page

A type alias gives a name to any type with the type keyword. Names make types reusable, keep code readable, and give you one place to change a type that is used everywhere.

Naming an object type#

TypeScript
type Student = {
  id: number;
  name: string;
  email: string;
  marks: number[];
};

function average(student: Student): number {
  return student.marks.reduce((a, b) => a + b, 0) / student.marks.length;
}

const asha: Student = { id: 1, name: "Asha", email: "asha@example.com", marks: [92, 85, 88] };
console.log(`${asha.name}: ${average(asha).toFixed(1)}`);
Output
Asha: 88.3

An alias does not create a new runtime value or class; it is only a name for the type, and disappears when the code is compiled.

Aliasing any kind of type#

Unlike interfaces, which only describe objects, type can name any type:

TypeScript
type ID = string | number;                          // a union
type Point = [x: number, y: number];                // a tuple
type Status = "draft" | "published" | "archived";   // literal union
type Formatter = (value: number) => string;         // a function type

const productId: ID = "SKU-42";
const origin: Point = [0, 0];
const state: Status = "published";
const asRupees: Formatter = (v) => `₹${v.toLocaleString("en-IN")}`;

console.log(productId, origin, state, asRupees(125000));
Output
SKU-42 [ 0, 0 ] published ₹1,25,000

Union Types and Literal Types explain the | syntax.

Building types from other types#

Aliases can use other aliases, so you can build up a model piece by piece:

TypeScript
type Address = {
  line1: string;
  city: string;
  pin: string;
};

type Customer = {
  name: string;
  phone?: string;
  shippingAddress: Address;
  billingAddress?: Address;
};

type Order = {
  readonly id: number;
  customer: Customer;
  items: { productId: string; qty: number }[];
  status: "placed" | "shipped" | "delivered";
};

const order: Order = {
  id: 1042,
  customer: { name: "Ravi", shippingAddress: { line1: "12 MG Road", city: "Bengaluru", pin: "560001" } },
  items: [{ productId: "SKU-42", qty: 2 }],
  status: "placed",
};

console.log(order.customer.shippingAddress.city, order.items.length);
Output
Bengaluru 1

Combining object types with & (intersections) is covered in Intersection Types.

Generic aliases#

An alias can take type parameters, like a function takes arguments:

TypeScript
type ApiResponse<T> = {
  ok: boolean;
  data: T;
  error?: string;
};

const userResponse: ApiResponse<{ name: string }> = { ok: true, data: { name: "Asha" } };
const countResponse: ApiResponse<number> = { ok: true, data: 42 };

console.log(userResponse.data.name, countResponse.data + 1);
Output
Asha 43

Generics are covered in depth in Generics.

Naming conventions#

  • Use PascalCase for type names: Student, ApiResponse.
  • Name types after what the data is, not after where it is used: Product rather than ProductCardProps, unless it really is only for that component.
  • Do not prefix names with T or I (TStudent, IStudent); this is an old convention most modern codebases avoid.

type or interface?#

For object shapes, type and interface are nearly interchangeable. The next lesson, Interfaces, compares them. A common, simple rule: use interface for object shapes that might be extended, and type for everything else (unions, tuples, functions, and combinations).

Practice#

Practice exercise

Create type aliases Money (a number), Category ("food" | "travel" | "bills") and Expense (with amount: Money, category: Category, note?: string). Write totalByCategory(expenses: Expense[], category: Category): Money, and test it.

Show solution
TypeScript
type Money = number;
type Category = "food" | "travel" | "bills";
type Expense = {
  amount: Money;
  category: Category;
  note?: string;
};

function totalByCategory(expenses: Expense[], category: Category): Money {
  return expenses.filter((e) => e.category === category).reduce((sum, e) => sum + e.amount, 0);
}

const expenses: Expense[] = [
  { amount: 250, category: "food", note: "Lunch" },
  { amount: 1200, category: "travel" },
  { amount: 180, category: "food" },
];

console.log(totalByCategory(expenses, "food"));
console.log(totalByCategory(expenses, "bills"));
Output
430
0

Key takeaway#

Finished this lesson?