Perbedaan Type dan Interface di TypeScript

Perbedaan Type dan Interface di TypeScript

typescriptinterfacetype
Akhmad Salafudin on 14 Apr 2023

Type dan Interface di TypeScript

Sebelumnya kita telah mempelajari kelebihan TypeScript daripada JavaScript biasa. Kali ini kita akan mengenal apa itu type dan interface. Dalam TypeScript, terdapat konsep type dan interface yang dapat membantu pengembang dalam menentukan tipe data dan struktur data dari variabel dan objek. Apa perbedaan di antara keduanya dan kapan kita menggunakannya?

Type

TypeScript memiliki fitur tipe data statis, yang memungkinkan kita untuk mendefinisikan tipe data variabel pada saat deklarasi. Ini memastikan bahwa hanya nilai yang sesuai dengan tipe data tersebut yang dapat disimpan dalam variabel tersebut.

TypeScript memiliki berbagai jenis tipe data, seperti string, number, boolean, dan lain-lain. Kita juga dapat membuat tipe data kustom dengan menggunakan tipe dasar seperti union, intersection, dan tuple. Kita akan bahas tipe-tipe tersebut di artikel lain.

Contoh penggunaan tipe data dalam TypeScript:

let name: string = "John";
let age: number = 30;
let isMarried: boolean = true;

Interface

Interface adalah konsep penting dalam TypeScript yang memungkinkan kita untuk mendefinisikan struktur objek dan menentukan tipe data dari properti dan metode dalam objek tersebut. Interface juga dapat digunakan untuk menentukan kontrak yang harus dipenuhi oleh objek.

Kita dapat menggunakan interface untuk membuat kode kita lebih mudah dibaca dan dipahami, serta untuk mencegah kesalahan penulisan kode yang umum dalam JavaScript. Interface dapat membantu kita dalam pengembangan aplikasi besar dan kompleks dengan menyediakan kemampuan untuk menentukan struktur data yang diperlukan dalam kode.

Contoh penggunaan interface dalam TypeScript:

interface Person {
    name: string;
    age: number;
    isMarried: boolean;
    sayHello(): void;
}

class Student implements Person {
    name: string;
    age: number;
    isMarried: boolean;

    constructor(name: string, age: number, isMarried: boolean) {
        this.name = name;
        this.age = age;
        this.isMarried = isMarried;
    }

    sayHello(): void {
        console.log(`Hello, my name is ${this.name}.`);
    }
}

let student: Person = new Student("John", 30, true);
student.sayHello(); // output: Hello, my name is John.

Dalam contoh di atas, interface Person digunakan untuk mendefinisikan struktur objek dan menentukan tipe data dari properti dan metode dalam objek tersebut. Kemudian, class Student diimplementasikan dengan mengikuti struktur Person. Dalam hal ini compiler akan error jika class Student tidak mengimplementasikan metode sayHello atau salah satu properti class tersebut diisi dengan nilai yang tidak sesuai. Misal

student.age = "20" // Error, Student.age harus bertipe number

Perbedaan Type dan Interface

Perbedaan dalam sintaksis

Sintaksis untuk menentukan tipe data dan struktur data dengan type dan interface berbeda. Saat menggunakan type, kita menggunakan keyword type, sedangkan saat menggunakan interface, kita menggunakan keyword interface. Sintaksis untuk mendefinisikan type dan interface juga berbeda, seperti contoh berikut:

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

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

Perbedaan dalam fungsionalitas

Type dapat digunakan untuk menentukan tipe data dasar, seperti string, number, dan boolean, serta tipe data yang kompleks, seperti union dan intersection. Type juga dapat digunakan untuk membuat alias dari tipe data yang sudah ada.

Sementara itu, interface digunakan untuk mendefinisikan struktur data objek, seperti properti dan metode dalam objek. Interface juga dapat digunakan untuk menerapkan kontrak pada class, sehingga class tersebut harus mengimplementasikan properti dan metode yang ada di dalam interface.

Namun, terkadang penggunaan type dan interface dapat dipertukarkan tergantung pada kebutuhan. Hal ini karena keduanya memiliki kemampuan yang sama dalam menentukan tipe data dan struktur data, namun dengan sintaksis dan fungsionalitas yang berbeda.

Kesimpulan

TypeScript menyediakan dua konsep utama untuk menentukan tipe data dan struktur data, yaitu type dan interface. Keduanya berbeda dalam sintaksis, fungsionalitas, dan penggunaan, namun dapat dipertukarkan tergantung pada kebutuhan. Dalam penggunaannya, type lebih sering digunakan untuk tipe data kompleks, sedangkan interface lebih sering digunakan untuk mendefinisikan struktur data objek dan menerapkan kontrak pada class.

Diskusi (0)

Silakan Login untuk berdiskusi