Type, or Interface, That Is the Question (in TypeScript)

In TypeScript, both type and interface are used to define types, and in many cases, they are interchangeable. However, they have some key differences and specific use cases. Before diving into the distinctions between type and interface, let’s first look at their basic usage.

1. Basic Usage: Defining Object Types with type and interface

// Using interface
interface User {
  name: string;
  age: number;
}

// Using type
type UserType = {
  name: string;
  age: number;
};

const user1: User = { name: 'Alice', age: 25 };
const user2: UserType = { name: 'Bob', age: 30 };

In this example, both interface and type can define an object type, and there is almost no difference in usage.

2. Extension (Extend)

2.1 Extending interface

interface can be extended using inheritance:

interface User {
  name: string;
  age: number;
}

interface Admin extends User {
  role: string;
}

const admin: Admin = {
  name: 'Alice',
  age: 30,
  role: 'Administrator',
};

2.2 Extending type

type can be extended using intersection types:

type UserType = {
  name: string;
  age: number;
};

type AdminType = UserType & {
  role: string;
};

const adminType: AdminType = {
  name: 'Bob',
  age: 35,
  role: 'Admin',
};

Difference:

• interface uses the extends keyword for inheritance.
• type uses & (intersection types) for extension.

3. Declaration Merging

3.1 Declaration Merging with interface

interface allows multiple declarations with the same name. TypeScript will automatically merge their members.

interface User {
  name: string;
}

interface User {
  age: number;
}

const user: User = { name: 'Alice', age: 25 }; // The merged User interface includes both name and age properties.

3.2 type Does Not Support Declaration Merging

type does not allow duplicate declarations, and doing so will result in an error.

type UserType = {
  name: string;
};

// Redeclaring the same type will throw an error
type UserType = {
  age: number; // Error: Duplicate identifier 'UserType'.
};

Difference:

• interface supports declaration merging, allowing multiple declarations to be combined.
• type does not support declaration merging.

4. Union Types and Intersection Types

4.1 type Supports Union and Intersection Types

type supports defining union and intersection types, which interface does not.

// Union type
type Status = 'success' | 'error' | 'loading';

// Intersection type
type Name = { name: string };
type Age = { age: number };
type Person = Name & Age;

const person: Person = { name: 'Alice', age: 25 };

4.2 interface Does Not Support Union Types

interface cannot directly define union types.

// Unsupported
interface Status = "success" | "error" | "loading"; // Error

Difference:

• type supports union and intersection types, making it more flexible when combining multiple types.
• interface cannot define union types but can extend object types.

5. Type Aliases

type can define aliases for various types, including primitives, tuples, union types, etc.

// Defining basic type aliases
type ID = number | string;

// Defining a tuple type
type Point = [number, number];

const id: ID = 123;
const point: Point = [10, 20];

interface, on the other hand, can only define object types.

6. Implementation (Implements) and Extension (Extends)

6.1 interface for Class Implementation

interface can constrain the structure of a class.

interface User {
  name: string;
  age: number;
}

class Person implements User {
  name: string;
  age: number;
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

6.2 type Can Also Constrain Classes

Although interface is commonly used for this purpose, type can achieve similar functionality.

type UserType = {
  name: string;
  age: number;
};

class PersonType implements UserType {
  name: string;
  age: number;
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}

Difference:

• interface is more commonly used in class design due to its ability to merge declarations and extend types more naturally.
• type can also constrain classes but is more suited for defining unions and complex type compositions.

7. Interoperability

7.1 interface and type Can Be Mixed

interface and type can be combined in practice. For example, an interface can extend a type and vice versa.

type Name = { name: string };

interface User extends Name {
  age: number;
}

const user: User = { name: 'Alice', age: 25 };

7.2 type Can Extend interface

interface User {
  name: string;
  age: number;
}

type Admin = User & {
  role: string;
};

const admin: Admin = { name: 'Bob', age: 35, role: 'Admin' };

Difference:

• interface can extend type, and type can extend interface, allowing them to be combined flexibly.

8. Expressing Complex Types

8.1 type Offers Greater Expressive Power

Since type supports union types, intersection types, and type aliases, it is more flexible for defining complex type compositions.

type ComplexType = string | number | { name: string };

const value1: ComplexType = 'Hello'; // Valid
const value2: ComplexType = 123; // Valid
const value3: ComplexType = { name: 'Alice' }; // Valid

8.2 interface Is Better for Object Structures

interface focuses on describing object structures and is less suitable for union or complex type combinations.

9. Summary of Use Cases

When to Use interface:

• Defining object types, especially in object-oriented design.
• Constraining classes with implements.
• Scenarios requiring declaration merging (e.g., third-party library type definitions).

When to Use type:

• Defining union types, intersection types, and other complex compositions.
• Creating aliases for primitive types and tuples.
• Scenarios requiring more flexibility in combining types.

Conclusion

interface

• Defining object types: ✅
• Alias for basic types: ❌
• Declaration merging: ✅
• Extension: extends inheritance
• Union types: ❌
• Intersection types: ❌
• Class implementation: ✅
• Expressive capability: Suitable for object structure definitions
• Common use case: Object-oriented design, combining classes with interfaces

type

• Defining object types: ✅
• Alias for basic types: ✅
• Declaration merging: ❌
• Extension: & intersection types
• Union types: ✅
• Intersection types: ✅
• Class implementation: ✅ (but less common)
• Expressive capability: Suitable for complex type compositions
• Common use case: Union types, complex type definitions, type aliases, etc.

Overall, interface is more suitable for object-oriented programming, especially in class design and inheritance. On the other hand, type is more flexible and is ideal for scenarios involving more complex type compositions and type aliases. In most projects, interface and type can be used complementarily.

---

We are Leapcell, your top choice for hosting Node.js projects.

Leapcell is the Next-Gen Serverless Platform for Web Hosting, Async Tasks, and Redis:

Multi-Language Support

• Develop with Node.js, Python, Go, or Rust.

Deploy unlimited projects for free

• pay only for usage — no requests, no charges.

Unbeatable Cost Efficiency

• Pay-as-you-go with no idle charges.
• Example: $25 supports 6.94M requests at a 60ms average response time.

Streamlined Developer Experience

• Intuitive UI for effortless setup.
• Fully automated CI/CD pipelines and GitOps integration.
• Real-time metrics and logging for actionable insights.

Effortless Scalability and High Performance

• Auto-scaling to handle high concurrency with ease.
• Zero operational overhead — just focus on building.

Explore more in the Documentation!

Follow us on X: @LeapcellHQ