How to Extend Types in TypeScript

By the end of this page, you will understand how to build new types from existing ones in TypeScript. You will learn the correct way to extend object shapes using interface extends and type intersections with &, when to use each approach, and how this pattern appears in real codebases.

In TypeScript, type aliases and interface declarations are similar, but they are not extended in exactly the same way.

If you define an object shape with type, you cannot write type NewType extends OldType = .... That syntax is not valid TypeScript.

To create a new type from an existing type, the usual approach is to use an intersection type with &:

type Event = {
  name: string;
  dateCreated: string;
  type: string;
};

type UserEvent = Event & {
  userId: string;
};

This means: take everything from Event and combine it with userId.

Another option is to use interface, which does support extends directly:

Think of a TypeScript object type like a checklist of required fields.

Event says:

• must have name
• must have dateCreated
• must have type

Now imagine you want a stricter checklist for a user-specific event. You do not throw away the original checklist. You stack another checklist on top of it.

So UserEvent means:

• everything required by Event
• plus userId

Using & is like merging two checklists together.

Using interface extends is like saying: “Start with this checklist, then add one more rule.”

Extending a type with &

type Event = {
  name: string;
  dateCreated: string;
  type: string;
};

type UserEvent = Event & {
  userId: string;
};

UserEvent now requires all four properties.

const loginEvent: UserEvent = {
  name: "User Login",
  dateCreated: "2026-05-04",
  type: "auth",
  userId: "u123"
};

Using interface extends

interface Event {
  name: string;
  dateCreated: string;
  : ;
}

    {
  : ;
}

Consider this example:

type Event = {
  name: string;
  dateCreated: string;
  type: string;
};

type UserEvent = Event & {
  userId: string;
};

const event: UserEvent = {
  name: "Purchase",
  dateCreated: "2026-05-04",
  type: "order",
  userId: "user-42"
};

Here is what happens step by step:

1. Event is defined as an object type with 3 required string properties.
2. UserEvent is created by combining:
   • all properties from Event
   • one extra property: userId
3. When TypeScript checks the event object, it expects:
   • name

This pattern is very common in real applications.

API models

A base response type may contain common fields:

type BaseRecord = {
  id: string;
  createdAt: string;
};

type User = BaseRecord & {
  email: string;
};

type Product = BaseRecord & {
  price: number;
};

Event tracking

Analytics systems often have shared event fields plus event-specific fields.

type BaseEvent = {
  timestamp: string;
  eventType: string;
};

type ClickEvent = BaseEvent & {
  elementId: string;
};

Backend validation models

You may define a base entity and extend it for different use cases such as create, update, or response types.

UI state objects

A component may reuse a base data shape and add local UI properties like loading state or error messages.

In real projects, developers usually combine small reusable types instead of repeating full object definitions.

Common patterns

Base domain models

type BaseEntity = {
  id: string;
  createdAt: string;
  updatedAt: string;
};

type Post = BaseEntity & {
  title: string;
  body: string;
};

Error handling

type ApiError = {
  message: string;
  code: string;
};

type FieldError = ApiError & {
  field: string;
};

Configuration objects

type BaseConfig = {
  env: string;
};

type DbConfig =  & {
  : ;
};

1. Trying to use extends with type

This is the exact problem in the question.

// Incorrect
type UserEvent extends Event = {
  userId: string;
};

Use this instead:

type UserEvent = Event & {
  userId: string;
};

2. Confusing type and interface

This works:

interface Event {
  name: string;
}

interface UserEvent extends Event {
  userId: string;
}

But this does not:

  = {
  : ;
};


    = {
  : ;
};

type vs interface

// Base type
type Event = {
  name: string;
  dateCreated: string;
  type: string;
};

// Correct: extend a type alias using &
type UserEvent = Event & {
  userId: string;
};

// Alternative: use interfaces
interface Event {
  name: string;
  dateCreated: string;
  type: string;
}

interface UserEvent extends Event {
  userId: string;
}

Rules to remember

• type X extends Y = ... is invalid.
• Use & to combine type aliases.
• Use extends with interface.

Can a TypeScript type extend another type?

Not with extends syntax in the alias declaration. Use an intersection with & instead.

How do I add properties to an existing type in TypeScript?

Create a new type using &:

type UserEvent = Event & { userId: string };

Should I use type or interface in TypeScript?

Use either consistently. interface is great for object shapes and extends; type is more flexible for unions, intersections, and other compositions.

Is interface extends the same as type &?

They are often similar for object shapes, but they are not identical in every advanced case. For this use case, both can model the same result.

Why does type UserEvent extends Event = ... fail?

• Type aliases — The original question uses type, so understanding aliases is essential.
• Interfaces — Interfaces support extends directly and are the closest alternative.
• Intersection types — This is the main mechanism for combining object types with &.
• Union types — Another important type feature, useful for representing one of several shapes.
• Optional properties — Often used when extending object shapes with fields that are not always present.
• Utility types — Tools like Pick, Omit, and Partial are often combined with extended types.
• Structural typing — TypeScript checks object shapes by structure, which explains why combined types work the way they do.