CalcSnippets Search
TypeScript 3 min read

TypeScript Interfaces vs Types: When to Use Each Clearly

Compare TypeScript interfaces and type aliases with practical examples for objects, unions, extension, declaration merging, APIs, and team conventions.

Interfaces and type aliases overlap, but they are not identical

TypeScript gives developers both interface and type for describing shapes. For many object models, either one can work. That overlap is why teams argue about style. The practical answer is to understand the differences, choose a convention, and use the form that makes the code easiest to understand.

An interface is often a natural fit for object shapes, especially public contracts that may be extended. A type alias can name object shapes too, but it can also name unions, intersections, primitives, tuples, mapped types, conditional types, and other type expressions. If the definition is not simply an object shape, type is usually required.

Use interfaces for extendable object contracts

Interfaces support extension with extends, and TypeScript can merge declarations with the same interface name. This can be useful for library authors and framework extension points. For application code, declaration merging can also be surprising if used casually. Still, interfaces are clear for props, service contracts, domain objects, and API-shaped objects when extension is expected.

Type aliases shine when modeling choices. A status union such as "draft" | "published" | "archived" must be a type. So do tuples, complex mapped types, and conditional types. Types are also useful when composing variants or representing discriminated unions.

  • Use interface for straightforward object contracts when your team prefers extension.
  • Use type for unions, tuples, mapped types, and complex composition.
  • Do not mix styles randomly in the same codebase.
  • Let readability matter more than winning a style argument.

API models need stability

When TypeScript describes API responses or request payloads, the name and shape should communicate the contract clearly. Whether you use an interface or type, avoid leaking backend uncertainty into every component. Define stable models, validate runtime data where needed, and keep optional fields honest. TypeScript types do not prove that external JSON is correct at runtime.

For React props, both interfaces and types are common. If props are simple object shapes, either is fine. If props are a discriminated union of variants, a type alias is usually clearer. Teams should document their preference so code reviews do not repeat the same debate.

Consistency beats personal preference

Large TypeScript projects benefit from a local convention. Some teams prefer interfaces for object shapes and types for everything else. Some teams use types almost everywhere. Both can work. The important part is that developers can predict the style and understand why a particular construct was chosen.

Interfaces and types are tools, not identities. Use the one that expresses the model clearly, supports the needed TypeScript feature, and fits the codebase convention. That is what keeps type definitions helpful instead of distracting.

Review types as public documentation

Type names often become the documentation developers read first. A clear InvoiceSummary, EditableProfile, or CheckoutState communicates intent better than a broad Data or Props. Whether you use an interface or a type alias, naming shapes how future developers understand the system.

Keep reading

Related guides