Step 5 – Object types and interfaces in TypeScript

image 2

Play Store Application link – Java to TypeScript in 14 Steps – App on Google Play

In TypeScript, objects and interfaces are crucial for structuring and defining data shapes. They help you manage and enforce the structure of data in a way similar to classes in Java.

Defining an Interface

An interface in TypeScript defines the shape of an object by specifying its properties and their types. You can also include optional properties.

Here’s how you define an interface:

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

In Java, this concept is similar to defining an abstract class or a class with specific properties:

public interface Person {
  String getName();
  int getAge();
  String getEmail(); // optional property if you have default implementation
}

Implementing an Interface

A class implements an interface using the implements keyword. The class must provide definitions for all properties and methods in the interface.

Example in TypeScript:

class Employee implements Person {
  name: string;
  age: number;
  email?: string;

  constructor(name: string, age: number, email?: string) {
    this.name = name;
    this.age = age;
    this.email = email;
  }
}

In Java:

public class Employee implements Person {
  private String name;
  private int age;
  private String email;

  public Employee(String name, int age, String email) {
    this.name = name;
    this.age = age;
    this.email = email;
  }

  // Implement methods from Person interface
  public String getName() { return name; }
  public int getAge() { return age; }
  public String getEmail() { return email; }
}

Object Types

Object types in TypeScript are similar to interfaces but are defined using the type keyword. They describe the shape of an object in the same way.

Example:

type Person = {
  name: string;
  age: number;
  email?: string;
}

In Java, you achieve a similar result using classes or data structures:

public class Person {
  private String name;
  private int age;
  private String email; // Optional

  // Constructor and methods
}

Readonly Properties

In TypeScript, you can make a property read-only using the readonly keyword:

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

In Java, you make fields immutable by declaring them as final:

public class Person {
  private final String name;
  private int age;

  public Person(String name, int age) {
    this.name = name;
    this.age = age;
  }

  public String getName() {
    return name;
  }
}

Extending Interfaces

Interfaces can extend other interfaces using the extends keyword, allowing you to build on existing definitions.

Example:

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

interface Employee extends Person {
  id: number;
  department: string;
}

In Java, extending interfaces is similar but uses the extends keyword:

public interface Person {
  String getName();
  int getAge();
}

public interface Employee extends Person {
  int getId();
  String getDepartment();
}

Summary

In TypeScript, interfaces and object types help define the shape of objects and enforce structure. Interfaces are more flexible and reusable, while object types offer a straightforward way to define object shapes. Both can include readonly properties and be extended to build more complex types.

Diagram

+----------------+
| Person         |
+----------------+
| name: string   |
| age: number    |
| email?: string |
+----------------+
        ^
        |
+-------+-------+
|               |
| Employee      |
|               |
+-------------------------+
| name: string            |
| age: number             |
| email?: string          |
| id: number              |
| department: string      |
+-------------------------+

Leave a Reply

Your email address will not be published. Required fields are marked *