Type Aliases in TypeScript: Naming Any Type You Want

Learn how the type keyword lets you name strings, object shapes, and unions in TypeScript, how type aliases compare to interfaces, and when to reach for each one.

Published September 20, 20268 min readBy ACY Partner Indonesia
Type Aliases cover with the code type ID = string
300 × 250Ad Space AvailablePlace your ad here

When you first meet TypeScript, you spend a lot of time writing the same type descriptions over and over. A user is { name: string; email: string } here, and { name: string; email: string } again three functions later. It works, but it gets noisy fast, and the moment you need to add one field you have to hunt down every copy. Type aliases fix exactly this. They let you give a name to a type — any type — and then reuse that name everywhere.

In this guide we will walk through what a type alias actually is, the kinds of types you can name with it, and how it stacks up against the interface keyword you may have already heard about. By the end you will know which one to reach for and why.

What a type alias is

A type alias is a name you attach to a type using the type keyword. The shape on the right side of the = is the real type; the name on the left is just a convenient label for it.

type ID = string;

let userId: ID = "u_1024";

Here ID is not a new, separate type. It is simply another way of saying string. Anywhere you could write string, you can now write ID instead, and TypeScript treats them as the same thing. The payoff is meaning: ID tells the reader why this string exists, while string alone tells them nothing.

This is the part beginners often miss, so it is worth saying plainly: an alias does not create a brand-new type at runtime. After your code compiles to JavaScript, the alias disappears completely. It exists only to help you and the type checker during development.

Aliases are erased at runtime

Type aliases live entirely in TypeScript’s world. They are removed when your code is compiled, so they add zero weight to the JavaScript that ships to your users. Think of them as labels for the compiler, not objects in memory.

Naming object shapes

The most common use for a type alias is naming the shape of an object. Instead of repeating the same field list, you describe it once and refer to it by name.

type User = {
  name: string;
  email: string;
  isActive: boolean;
};

const jane: User = {
  name: "Jane Doe",
  email: "jane@example.com",
  isActive: true,
};

Now User is a reusable contract. If you later decide every user also needs a createdAt field, you change the alias in one place and TypeScript immediately flags every spot that no longer fits. That single source of truth is the whole point.

You can nest aliases inside each other too, which keeps larger shapes readable:

type Address = {
  city: string;
  country: string;
};

type Customer = {
  name: string;
  address: Address;
};

Breaking a big object into smaller named pieces like this makes each part easy to read and reuse on its own.

Beyond objects: aliasing primitives and functions

This is where type aliases really earn their keep. An interface can only describe object-like shapes, but type can name anything — including primitives, functions, arrays, and tuples.

type Email = string;
type Score = number;

type Greeter = (name: string) => string;

type Point = [number, number];

Greeter names a function type: any function that takes a string and returns a string. Point names a tuple — an array of exactly two numbers. None of these are object shapes, and that flexibility is one of the strongest reasons to pick type.

Union types: the killer feature

The single biggest reason people reach for type aliases is the union type. A union says “this value can be one of these several types,” and you write it with the vertical bar |.

type Status = "pending" | "active" | "banned";

let accountStatus: Status = "active";
// accountStatus = "deleted"; // Error: not one of the allowed values

Status can only ever be one of those three exact strings. Try to assign anything else and TypeScript stops you before the code ever runs. This pattern — a fixed set of allowed string values — is everywhere in real apps, from order states to button variants.

Unions are not limited to strings. You can combine any types at all:

type Id = string | number;

function findUser(id: Id) {
  // id might be a string OR a number here
}

Giving a union a name with type is the natural, idiomatic way to do it. This is also the foundation for more advanced topics like intersections and discriminated unions, which build directly on what you have just seen.

Status alias
  ┌──────────┐
  │ "pending"│ ─┐
  │ "active" │ ─┼─►  one value, must match exactly one option
  │ "banned" │ ─┘
  └──────────┘

Type alias vs interface

If you have read any TypeScript tutorial, you have probably seen interface too. For describing an object, the two look almost identical:

type UserA = {
  name: string;
  email: string;
};

interface UserB {
  name: string;
  email: string;
}

Both work, and for a plain object shape you can use either. The differences show up at the edges. Here is the practical comparison:

Feature type interface
Object shapes Yes Yes
Primitives, unions, tuples, functions Yes No
Extending / composing With & (intersection) With extends
Declaration merging (re-opening to add fields) No Yes
Best for Unions, function types, “anything not an object” Public object contracts, class shapes

The one genuinely unique trick interface has is declaration merging: if you declare the same interface name twice, TypeScript merges them into one. That sounds odd, but it is useful for extending types from external libraries. A type alias cannot be re-opened that way — declare the same name twice and you get an error.

A simple rule of thumb

Use a type alias when you are naming a union, a function type, or anything that is not a plain object. Reach for interface when you are defining the public shape of an object or a class, especially one that other code or libraries might extend later. When in doubt for a simple object, either is fine — just be consistent across your codebase.

Composing types together

Because aliases can name unions, they can also be combined. The & operator creates an intersection — a type that must satisfy all the parts at once.

type Timestamps = {
  createdAt: string;
  updatedAt: string;
};

type Article = {
  title: string;
  body: string;
} & Timestamps;

An Article now needs title, body, createdAt, and updatedAt — the fields from both shapes merged together. This is the type equivalent of interface ... extends, and it is a clean way to share common fields across many shapes without repeating them.

A few common mistakes

A couple of small traps catch beginners. First, remember that aliasing a primitive does not make it a distinct type. type Email = string and type Score = number both reduce to their underlying primitive, so TypeScript will happily let you pass an Email where a plain string is expected, and vice versa. The alias adds readability, not extra safety against mixing.

Second, do not confuse a type alias with a variable. It lives in the type world, not the value world, so you cannot use it where a runtime value is expected:

type Status = "active" | "banned";

console.log(Status); // Error: 'Status' only refers to a type, not a value

Types are not values

A type alias only exists during type checking. You cannot log it, pass it as an argument, or treat it like a normal object. If you need a runtime list of allowed values, you want an enum or a plain array of constants instead.

Recap

Type aliases are one of the most useful everyday tools in TypeScript. Here is what to carry forward:

  • The type keyword gives a name to any type — primitives, object shapes, functions, tuples, and unions — not just objects.
  • Naming an object shape gives you a single source of truth you can reuse and update in one place.
  • Unions written with | are the standout use case, perfect for a fixed set of allowed values like statuses.
  • Aliases are erased at compile time, so they cost nothing at runtime and are not real values you can use in code.
  • Use type for unions, function types, and anything non-object; use interface for object contracts you may want to extend or merge.

With aliases under your belt, you are ready to go deeper into unions and intersections, where naming types becomes the building block for describing real, branching data with confidence.

Tags:typescripttype-aliasestypesinterfacefrontend
728 × 90Ad Space AvailablePlace your ad here

Related Articles

See All Articles

You Might Also Like

Frontend best practices overview cover
Frontend / Fundamentals

Frontend Best Practices: An Overview

A friendly map of what good frontend really means — semantic HTML, clean CSS, unobtrusive JavaScript, responsive layouts, performance, and progressive enhancement, with pointers to go deeper.

Sep 20, 20268 min read
A Frontend Developer Roadmap cover with the path HTML to CSS to JavaScript
Frontend / Fundamentals

A Frontend Developer Roadmap: What to Learn, and in What Order

A calm, step-by-step learning path for beginners: HTML, CSS, JavaScript, developer tools, responsive and accessible design, a framework, TypeScript, and deployment, with the reasoning behind each step.

Sep 20, 202611 min read
Title card reading Styling and Interactivity over a dark blue ACY Partner background
Frontend / Fundamentals

How Styling and Interactivity Work

A beginner-friendly look at how CSS turns plain HTML into a designed layout, and how JavaScript adds behavior — the structure, style, behavior mental model for building web pages.

Sep 20, 20269 min read
Three front-end layers combining on one web page
Frontend / Fundamentals

How HTML, CSS, and JavaScript Work Together

A hands-on walkthrough for beginners: build one small button, give it structure with HTML, looks with CSS, and behavior with JavaScript, and watch the three layers cooperate on a real page.

Sep 20, 20268 min read
The Frontend Developer Toolkit cover with editor, browser, and CLI motifs
Frontend / Fundamentals

The Frontend Developer Toolkit

A friendly tour of the everyday tools a frontend developer relies on — code editor, browser and DevTools, terminal, version control, package managers, and a dev server — and what each one is actually for.

Sep 20, 202610 min read
Cover illustration for What Frontend Developers Do
Frontend / Fundamentals

What Frontend Developers Do: A Beginner's Guide to the Role

A clear, beginner-friendly look at what frontend developers actually do every day: turning designs into working interfaces, building reusable UI, and caring about responsiveness, accessibility, and speed.

Sep 20, 202610 min read