interface Interface (extension & declaration merging)
Last updated: 2026-10-22
interface Interface (extension & declaration merging)
An interface gives an object shape a name: it declares which properties and methods exist and their types. Interfaces exist only at compile time (fully erased after transpilation) and support extends and declaration merging — the sibling of type aliases.
| Group | Type Composition |
|---|---|
| Kind | Syntax |
| Strict mode | Not required |
ℹ️ Info The editor transpiles TypeScript to JavaScript and runs it (no type checking); see each example's Output for type-check results.
📝 Syntax
interface Animal {
name: string;
speak(): void;
}
// Extension
interface Pet extends Animal {
owner: string;
}
// Declaration merging: same-named interfaces merge automatically
interface Window { title: string }
interface Window { version: number }⚙️ Parameters
| extends | Extend one or more interfaces to inherit all their members |
|---|---|
| ?: | Optional property marker; the property may be absent |
| readonly | readonly modifier; the property cannot be reassigned |
Returns：None — interfaces are a type-level concept and produce no runtime code.
▶ Example
Edit the code below and click Try it to see the transpiled result:
Output：
Tom Jerry
Meow
(Runtime output after transpilation; type checking is done by tsc — changing name to a number yields error TS2322)💡 Notes
ℹ️ Info Interfaces are fully erased after transpilation — zero runtime cost; they are a structural contract only the compiler reads.
💡 Tip Same-named interfaces merge automatically (declaration merging) — the standard way to augment third-party types (e.g. adding fields to window).
⚠️ Note interface and type aliases are interchangeable in most cases; use type for unions/mapped/conditional types, and interface when you need declaration merging (lessons 9/11 have the full comparison).
🏷️ Related Type Composition
💡 Related cases
More cases coming soon.
📚 Related tutorials
❓ FAQ
Q How is interface different from type?
A Both define object shapes and are interchangeable day-to-day. interface supports extends and declaration merging; type can express unions, tuples, mapped and conditional types. Pick one per team convention and mix sparingly.
Q Can interface describe functions, arrays or classes?
A Yes: call signatures ((x: number) => string) describe functions, index signatures ([i: number]: T) describe arrays, construct signatures describe constructors, and classes implement interfaces with implements.
Q What is declaration merging and when is it useful?
A Members of two same-named interfaces merge into one. Typical use: adding custom fields to library types like window or Request without touching the library source.
