Kelas dalam TypeScript

Artikel ini menjelaskan kelas dalam TypeScript.

YouTube Video

Kelas dalam TypeScript

Kelas dalam TypeScript didasarkan pada kelas ES6 JavaScript dan menawarkan fitur tambahan seperti anotasi tipe dan pengubah akses. Ini memungkinkan Anda memanfaatkan konsep pemrograman berorientasi objek sambil memastikan keamanan tipe yang lebih kuat dan jelas.

Di bawah ini adalah penjelasan tentang penggunaan dasar dan fitur kelas dalam TypeScript.

Definisi Kelas Dasar

 1class Person {
 2    name: string;  // Member variable
 3    age: number;   // Member variable
 4
 5    // Constructor
 6    constructor(name: string, age: number) {
 7        this.name = name;
 8        this.age = age;
 9    }
10
11    // Method
12    greet(): void {
13        console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
14    }
15}
16
17const person = new Person("Alice", 25);
18person.greet();  // Hello, my name is Alice and I am 25 years old.

• name dan age adalah properti (variabel anggota) dari kelas.
• constructor adalah metode yang dipanggil saat membuat instance dari sebuah kelas, yang menerima argumen dan memberikan nilai ke properti.
• greet adalah metode dari kelas, yang menunjukkan bahwa ia tidak memiliki nilai kembali dengan tipe void.

Pengubah Akses

Dalam TypeScript, Anda dapat menggunakan pengubah akses (public, private, protected) untuk mengontrol akses ke properti dan metode kelas.

public

Secara default, semua properti dan metode adalah public. Ini berarti mereka dapat diakses dari luar kelas.

 1class Animal {
 2    public species: string;
 3
 4    constructor(species: string) {
 5        this.species = species;
 6    }
 7
 8    public makeSound(): void {
 9        console.log(`${this.species} makes a sound.`);
10    }
11}
12
13const animal = new Animal("Dog");
14console.log(animal.species);  // Dog
15animal.makeSound();           // Dog makes a sound.

• Properti species dan metode makeSound dideklarasikan sebagai public dan dapat diakses dari luar kelas.

private

Menggunakan pengubah private mencegah akses ke properti atau metode dari luar kelas.

 1class Car {
 2    private brand: string;
 3
 4    constructor(brand: string) {
 5        this.brand = brand;
 6    }
 7
 8    public getBrand(): string {
 9        return this.brand;
10    }
11}
12
13const car = new Car("Toyota");
14// console.log(car.brand);  // Error: 'brand' is private and cannot be accessed.
15console.log(car.getBrand());  // Toyota

• Properti brand dideklarasikan sebagai private, sehingga tidak dapat diakses dari luar kelas.
• Enkapsulasi data dapat dicapai dengan menyembunyikan properti menggunakan modifier private.

protected

Pengubah protected membatasi akses dari luar kelas tetapi mengizinkannya dalam subkelas (kelas turunan).

 1class Vehicle {
 2    protected model: string;
 3
 4    constructor(model: string) {
 5        this.model = model;
 6    }
 7}
 8
 9class Truck extends Vehicle {
10    public getModel(): string {
11        return this.model;
12    }
13}
14
15const truck = new Truck("Ford F-150");
16console.log(truck.getModel());  // Ford F-150
17
18// console.log(truck.model);
19// Error: Property 'model' is protected and only accessible within class 'Vehicle' and its subclasses.

• Properti model dideklarasikan sebagai protected, sehingga tidak dapat diakses dari luar kelas, tetapi dapat diakses dari subclass.

Getter dan Setter

Dalam TypeScript, Anda dapat mendefinisikan getter dan setter menggunakan kata kunci get dan set untuk mengambil dan menetapkan nilai properti.

 1class Employee {
 2    private _salary: number;
 3
 4    constructor(salary: number) {
 5        this._salary = salary;
 6    }
 7
 8    // Getter
 9    get salary(): number {
10        return this._salary;
11    }
12
13    // Setter
14    set salary(newSalary: number) {
15        if (newSalary > 0) {
16            this._salary = newSalary;
17        } else {
18            console.log("Salary must be positive.");
19        }
20    }
21}
22
23const employee = new Employee(50000);
24console.log(employee.salary);  // 50000
25employee.salary = 60000;
26console.log(employee.salary);  // 60000
27employee.salary = -100;        // Salary must be positive.

• Dalam contoh ini, getter dan setter digunakan untuk properti salary untuk mengontrol akses dan pembaruan dari luar. Setter melakukan validasi untuk mencegah nilai negatif, dan menampilkan pesan peringatan jika nilai yang tidak valid diberikan.

Pewarisan

Dalam TypeScript, kelas dapat diwarisi. Dengan menggunakan kata kunci extends, Anda dapat mewarisi fungsionalitas dari kelas induk.

 1class Animal {
 2    constructor(public name: string) {}
 3
 4    public move(): void {
 5        console.log(`${this.name} is moving.`);
 6    }
 7}
 8
 9class Bird extends Animal {
10    public fly(): void {
11        console.log(`${this.name} is flying.`);
12    }
13}
14
15const bird = new Bird("Sparrow");
16bird.move();  // Sparrow is moving.
17bird.fly();   // Sparrow is flying.

• Dalam contoh ini, kelas Bird mewarisi dari kelas Animal, yang memungkinkannya menggunakan metode move dari Animal. Selain itu, ia mendefinisikan metode fly sendiri, menambahkan fungsionalitas baru sambil mewarisi fitur dari kelas induk.

Kelas Abstrak

Kelas abstrak (abstract) tidak dapat dibuat instance secara langsung dan digunakan sebagai template untuk memberikan implementasi konkret dalam subkelas.

 1abstract class Shape {
 2    abstract getArea(): number;
 3
 4    public describe(): void {
 5        console.log("This is a shape.");
 6    }
 7}
 8
 9class Circle extends Shape {
10    constructor(private radius: number) {
11        super();
12    }
13
14    public getArea(): number {
15        return Math.PI * this.radius * this.radius;
16    }
17}
18
19const circle = new Circle(5);
20console.log(circle.getArea());  // 78.53981633974483
21circle.describe();  // This is a shape.

• Dalam contoh ini, Shape didefinisikan sebagai kelas abstrak, dan getArea adalah metode abstrak yang harus diimplementasikan oleh subclass. Kelas Circle mewarisi kelas abstrak ini dan mengimplementasikan metode getArea miliknya sendiri untuk menghitung luas lingkaran. Selain itu, metode konkret seperti describe diwarisi sebagai fungsionalitas umum dan dapat digunakan langsung sebagaimana adanya.

Hubungan dengan Antarmuka

Kelas dapat mengimplementasikan antarmuka, memastikan mereka memiliki properti dan metode tertentu.

 1interface Flyable {
 2    fly(): void;
 3}
 4
 5class Airplane implements Flyable {
 6    public fly(): void {
 7        console.log("The airplane is flying.");
 8    }
 9}
10
11const airplane: Flyable = new Airplane();
12airplane.fly();  // The airplane is flying.

• Dalam contoh ini, interface Flyable mendefinisikan spesifikasi untuk metode fly, dan kelas Airplane mengimplementasikan interface ini dengan memberikan definisi konkret untuk metode fly. Dengan ini, setiap objek yang bisa diperlakukan sebagai tipe Flyable dijamin memiliki metode fly.

Anggota Statis

Saat Anda mendefinisikan anggota statis dalam sebuah kelas, metode dan properti tersebut terkait dengan kelas itu sendiri. Anggota statis dapat dipanggil tanpa harus membuat instansi dari kelas tersebut.

 1class MathUtils {
 2    static PI: number = 3.14;
 3
 4    static add(a: number, b: number): number {
 5        return a + b;
 6    }
 7}
 8
 9console.log(MathUtils.add(10, 20)); // 30
10console.log(MathUtils.PI); // 3.14

• Anda mendefinisikan metode statis menggunakan kata kunci static.
• Dalam contoh ini, kelas MathUtils mendefinisikan metode statis add dan properti statis PI.
• Anggota statis tidak termasuk dalam instansi kelas, tetapi dapat dipanggil langsung dari kelas itu sendiri.

Ringkasan

Kelas TypeScript menambahkan fitur seperti keamanan tipe, pengubah akses, dan kelas abstrak ke dalam fungsi kelas JavaScript. Hal ini memungkinkan pemrograman berorientasi objek yang lebih kuat dan lebih aman.

Anda dapat mengikuti artikel di atas menggunakan Visual Studio Code di saluran YouTube kami. Silakan periksa juga saluran YouTube kami.

YouTube Video