🎓 A1Learner
🔍
0 of 42 lessons completed

TypeScript Interfaces in Depth

Declaration merging combines two interface blocks with the same name into one shape. A value must satisfy every block before the checker accepts it.

Two blocks, one shape

The second block adds an email member to the first block. The value below must carry members from both blocks.

interface UserProfile {
  id: number;
  displayName: string;
}
interface UserProfile {
  email: string;
}
const profile: UserProfile = {
  id: 7,
  displayName: "Asha",
  email: "asha@example.com",
};
console.log(profile.id);
console.log(profile.displayName);
console.log(profile.email);

Extending two interfaces at once

The extends list names two interfaces. The new interface inherits every member of both, then adds its own.

interface HasId {
  id: number;
}
interface HasTimestamp {
  createdAt: string;
}
interface ArticleRecord extends HasId, HasTimestamp {
  title: string;
}
const record: ArticleRecord = {
  id: 3,
  createdAt: "2026-01-10",
  title: "Guide",
};
console.log(record.id);
console.log(record.createdAt);
console.log(record.title);

Example

interface ProductCard {
  sku: string;
  price: number;
}
interface ProductCard {
  inStock: boolean;
}
const cardItem: ProductCard = {
  sku: "PEN-10",
  price: 250,
  inStock: true,
};
console.log(cardItem.sku);
console.log(cardItem.price);
console.log(cardItem.inStock);

Key points

  • Declaration merging is the compiler combining same-named interface blocks into one shape.
  • A merged value must provide the members from every block.
  • An interface can extend two interfaces at once and inherit the members of both.
  • A later block adds members without editing the first block.

In this example, the second ProductCard block merges with the first, so cardItem must provide sku, price and inStock together.

Note

Merging works only when a repeated member keeps the same type in every block.

Try it Yourself

Edit the code, then press Run.

Running is simulated · TypeScript Playground

Exercise

What does declaration merging require from a value typed by a merged interface?