Traffine I/O

Bahasa Indonesia

2022-11-21

Types and Interfaces dalam TypeScript

Type dalam TypeScript

Dalam TypeScript, kata kunci type digunakan untuk mendefinisikan tipe-tipe kompleks yang tidak dapat dijelaskan dengan satu kata kunci tipe saja. Kata kunci type memberikan alias untuk deklarasi tipe yang lebih kompleks, sehingga memungkinkan kode yang lebih ringkas dan mudah dibaca.

Berikut adalah contoh penggunaan type dalam TypeScript:

ts
type Point = {
  x: number;
  y: number;
};

Pada contoh ini, kita mendefinisikan tipe Point yang mewakili koordinat pada bidang dua dimensi.

Interface dalam TypeScript

Sebuah interface dalam TypeScript adalah cara untuk mendefinisikan kontrak terhadap struktur tertentu dari sebuah objek. Antarmuka terutama digunakan untuk mendefinisikan struktur objek dan untuk pewarisan antar kelas.

Berikut adalah contoh penggunaan interface dalam TypeScript:

ts
interface Point {
  x: number;
  y: number;
}

Sama seperti contoh tipe sebelumnya, kita mendefinisikan antarmuka Point yang mewakili koordinat pada bidang dua dimensi.

Perbedaan antara type dan interface

Baik type maupun interface adalah konstruksi dasar yang memungkinkan Anda untuk mendefinisikan tipe-tipe baru dalam program Anda, tetapi keduanya bekerja dengan cara yang berbeda secara halus dan sesuai dengan jenis masalah yang berbeda pula.

Penggabungan Deklarasi

Salah satu perbedaan kunci adalah bahwa interface dapat digabungkan (merged), sedangkan tipe-tipe tidak dapat. Dalam TypeScript, jika Anda mendeklarasikan sebuah interface beberapa kali, deklarasinya akan digabungkan menjadi satu interface tunggal.

ts
interface Foo {
  x: number;
}

interface Foo {
  y: number;
}

// Foo is now { x: number; y: number; }

Namun, dengan type, operasi yang sama akan menghasilkan kesalahan identifikasi duplikat:

ts
type Bar = {
  x: number;
};

type Bar = {
  y: number;
};

// Error: Duplicate identifier 'Bar'.

Pewarisan dan Implementasi

interface dapat memperluas (extend) dan diperluas (be extended) oleh interface lainnya, dan juga dapat diimplementasikan oleh kelas-kelas. Hal ini dapat menyediakan bentuk kontrak kode dalam implementasi kelas.

ts
interface A {
  x: number;
}

interface B extends A {
  y: number;
}

class MyClass implements B {
  x = 5;
  y = 10;
}

type, di sisi lain, dapat memperluas (extend) dan mempersilangkan (intersect) dengan type lainnya, tetapi tidak dapat diimplementasikan oleh kelas-kelas:

ts
type C = {
  x: number;
};

type D = C & {
  y: number;
};

// This won't work
class MyOtherClass implements D {
  x = 5;
  y = 10;
}

// Error: Class 'MyOtherClass' incorrectly implements interface 'D'.
// Property 'x' is missing in type 'MyOtherClass' but required in type 'D'.

Penggunaan dengan Tipe-tipe Primitif

Kata kunci type dapat mewakili tipe-tipe primitif seperti string, number, boolean, null, undefined, dll. Sebaliknya, interface hanya digunakan untuk mewakili struktur objek.

ts
type MyString = string;
type NullableNumber = number | null;

Properti Terkomputasi

Alias type dapat memiliki properti terkomputasi, sedangkan interface tidak dapat:

ts
type ComputedType = {
  [P in 'x' | 'y']: number;
};

// This is invalid for interfaces
interface ComputedInterface {
  [P in 'x' | 'y']: number;
}

// Error: An index signature parameter type cannot be a union type. Consider using a mapped object type instead.

Tipe Literal

Alias type dapat mengungkapkan tipe literal, dan dapat menggabungkannya dengan cara yang tidak dapat dilakukan dengan interface.

ts
type Direction = 'North' | 'East' | 'South' | 'West';

Ryusei Kakujo

researchgatelinkedingithub

Focusing on data science for mobility

Bench Press 100kg!