TypeScript
Types and Interface

Types and Interface

Types dan Interface adalah metode untuk mendeklarasikan tipe data pada TypeScript. Keduanya memiliki perbedaan yang cukup signifikan.

Type

Type adalah metode untuk mendeklarasikan tipe data pada TypeScript. Type digunakan untuk mendeklarasikan tipe data pada variabel, parameter, dan return value pada function.

type stringOrNumber = string | number;
 
let age: stringOrNumber = 20;
 
age = "20";

Interface

Interface adalah metode untuk mendeklarasikan tipe data pada TypeScript. Interface digunakan untuk mendeklarasikan tipe data pada object.

interface Person {
  name: string;
  age: number;
}
 
const person: Person = {
  name: "John Doe",
  age: 20,
};

Type vs Interface

Type dan Interface memiliki perbedaan yang cukup signifikan. perbedaan tersebut adalah:

  • Type dapat digunakan untuk mendeklarasikan tipe data pada object. Sedangkan Interface tidak dapat digunakan untuk mendeklarasikan tipe data pada variabel, parameter, dan return value pada function.
  • Type dapat digunakan untuk mendeklarasikan tipe data pada object secara langsung. Sedangkan Interface tidak dapat digunakan untuk mendeklarasikan tipe data pada object secara langsung.

Contoh

Type dapat digunakan untuk mendeklarasikan tipe data pada variabel, parameter, dan return value pada function. Sedangkan Interface hanya dapat digunakan untuk mendeklarasikan tipe data pada object.

type Person = {
  name: string;
  age: number;
};
 
const person: Person = {
  name: "John Doe",
  age: 20,
};
 
function getPerson(person: Person): Person {
  return person;
}
interface Person {
  name: string;
  age: number;
}
 
const person: Person = {
  name: "John Doe",
  age: 20,
};
 
function getPerson(person: Person): Person {
  return person;
}

Type dapat digunakan untuk mendeklarasikan tipe data pada object secara langsung. Sedangkan Interface tidak dapat digunakan untuk mendeklarasikan tipe data pada object secara langsung.

const person: {
  name: string;
  age: number;
} = {
  name: "John Doe",
  age: 20,
};
 
function getPerson(person: { name: string; age: number }): {
  name: string;
  age: number;
} {
  return person;
}
interface Person {
  name: string;
  age: number;
}
 
const person: Person = {
  name: "John Doe",
  age: 20,
};
 
function getPerson(person: Person): Person {
  return person;
}
Type AssertionExtends