TypeScript Interfaces

Interfaces in TypeScript define the structure of objects by specifying properties, their types, and optional or read-only attributes. They help enforce consistent object shapes, making code more reliable and maintainable.

 

Why Use Interfaces?

• Define a clear structure for objects.
• Enable type-checking for object properties.
• Facilitate better code reuse and documentation.

 

Defining an Interface

You can define an interface using the interface keyword.

interface Person {  
  name: string;  
  age: number;  
  isStudent: boolean;  
}  

let person1: Person = {  
  name: "John",  
  age: 25,  
  isStudent: true  
};  

console.log(person1.name, person1.age);  

Optional Properties

You can make a property optional by adding a ? after the property name.

interface Person {  
  name: string;  
  age?: number;  // Optional property  
}  

let person2: Person = {  
  name: "Alice"  
};  

console.log(person2.name); // Works even without `age`

Read-Only Properties

Use readonly to ensure that a property cannot be modified after initialization.

interface Car {  
  readonly model: string;  
  year: number;  
}  

let myCar: Car = {  
  model: "Tesla",  
  year: 2023  
};  

myCar.year = 2024; // Allowed  
myCar.model = "Ford"; // Error: Cannot assign to 'model' because it is a read-only property

Function Types

Interfaces can define the structure of functions using parameters and return types.

interface Add {  
  (a: number, b: number): number;  
}  

let addition: Add = function (x, y) {  
  return x + y;  
};  

console.log(addition(10, 20)); // Output: 30

Interface with Arrays

You can use interfaces to define the structure of arrays.

interface StringArray {  
  [index: number]: string;  
}  

let names: StringArray = ["Alice", "Bob", "Charlie"];  

console.log(names[0]); // Output: Alice

Extending Interfaces

Interfaces can extend other interfaces, allowing you to reuse structure.

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

interface Employee extends Person {  
  employeeId: number;  
}  

let emp: Employee = {  
  name: "John",  
  age: 30,  
  employeeId: 1234  
};  

console.log(emp.name, emp.employeeId);

Interface for Classes

Interfaces can enforce a class structure by defining required properties and methods.

interface Shape {  
  area(): number;  
}  

class Circle implements Shape {  
  radius: number;  

  constructor(radius: number) {  
    this.radius = radius;  
  }  

  area(): number {  
    return Math.PI * this.radius * this.radius;  
  }  
}  

let circle = new Circle(5);  
console.log(circle.area()); // Output: 78.54

Intersection Types

Interfaces can be combined using intersection types (&) for complex structures.

interface Person {  
  name: string;  
}  

interface Job {  
  title: string;  
}  

type Employee = Person & Job;  

let employee: Employee = {  
  name: "Alice",  
  title: "Software Engineer"  
};  

console.log(employee.name, employee.title);

 

Summary

Interfaces in TypeScript provide a flexible and powerful way to define object structures, enforce type-checking, and create reusable code. They support optional, read-only properties, extendability, and can be used with classes, arrays, and functions for better type safety and clarity.