Mga Klase sa TypeScript

Ipinaliliwanag ng artikulong ito ang mga klase sa TypeScript.

YouTube Video

Mga Klase sa TypeScript

Ang mga klase sa TypeScript ay batay sa mga klase ng ES6 ng JavaScript at nag-aalok ng mga karagdagang tampok tulad ng mga anotasyon sa uri at mga modifier ng access. Pinahihintulutan ka nitong gamitin ang mga konsepto ng object-oriented programming habang tinitiyak ang mas matatag at malinaw na kaligtasan ng uri.

Narito ang mga paliwanag ng pangunahing paggamit at mga tampok ng mga klase sa TypeScript.

Pangunahing Depinisyon ng Klase

 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.

• Ang name at age ay mga katangian (mga variable ng miyembro) ng klase.
• Ang constructor ay isang pamamaraan na tinatawag kapag gumagawa ng isang instance ng klase, na tumatanggap ng mga argumento at nagtatakda ng mga halaga sa mga katangian.
• Ang greet ay isang pamamaraan ng klase, na nagpapahiwatig na wala itong ibinabalik na halaga dahil ito ay uri ng void.

Mga Modifier ng Access

Sa TypeScript, maaari mong gamitin ang mga access modifier (public, private, protected) upang kontrolin ang pag-access sa mga katangian at pamamaraan ng klase.

public

Sa karaniwan, lahat ng katangian at pamamaraan ay public. Ibig sabihin nito ay maaari silang ma-access mula sa labas ng klase.

 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.

• Ang property na species at method na makeSound ay dineklara bilang public at maaari itong ma-access mula sa labas ng class.

private

Ang paggamit ng private modifier ay pumipigil sa pag-access sa mga katangian o pamamaraan mula sa labas ng klase.

 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

• Ang property na brand ay dineklara bilang private, kaya hindi ito ma-access mula sa labas ng class.
• Ang pag-eencapsulate ng data ay maaaring makamit sa pamamagitan ng pagtatago ng properties gamit ang modifier na private.

protected

Ang protected modifier ay nililimitahan ang pag-access mula sa labas ng klase ngunit pinapayagan ito sa mga subclass (mga derived na klase).

 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.

• Ang property na model ay dineklara bilang protected, kaya hindi ito ma-access mula sa labas ng class, ngunit maaaring ma-access mula sa subclasses.

Mga Getter at Setter

Sa TypeScript, maaari kang magtakda ng mga getter at setter gamit ang mga keyword na get at set upang makuha at itakda ang mga halaga ng katangian.

 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.

• Sa halimbawang ito, gumagamit ng getter at setter para sa property na salary upang kontrolin ang external na pag-access at pag-update. Ang setter ay nagsasagawa ng validation upang maiwasan ang negatibong halaga, at magpapakita ng warning message kung invalid ang ibinigay na value.

Pagmamana

Sa TypeScript, ang mga klase ay maaaring mamana. Gamit ang keyword na extends, maaari kang magmana ng functionality mula sa isang parent na klase.

 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.

• Sa halimbawang ito, ang class na Bird ay nagmana mula sa class na Animal, kaya maaari nitong gamitin ang method na move ng Animal. Bukod pa rito, nagde-define ito ng sarili nitong method na fly, na nagpapagdagdag ng bagong functionality habang minamana ang mga features mula sa parent class.

Mga Abstraktong Klase

Ang mga abstraktong klase (abstract) ay hindi maaaring instansiyahan nang direkta at ginagamit bilang mga template upang magbigay ng konkretong implementasyon sa mga subclass.

 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.

• Sa halimbawang ito, ang Shape ay dineklara bilang isang abstract class, at ang getArea ay abstract method na kailangang i-implement ng subclasses. Ang class na Circle ay nagmana sa abstract class at nag-implement ng sarili nitong method na getArea para kuwentahin ang area ng circle. Bukod dito, ang mga kongkretong method tulad ng describe ay minamana bilang pangkaraniwang functionality at maaaring gamitin agad.

Kaugnayan sa mga Interface

Ang mga klase ay maaaring magpatupad ng mga interface, na tinitiyak na mayroon silang mga tiyak na katangian at pamamaraan.

 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.

• Sa halimbawang ito, ang interface na Flyable ay naglalahad ng specification para sa method na fly, at ang Airplane class ay nag-iimplement ng interface na ito sa pamamagitan ng pagbibigay ng konkretong definition para sa method na fly. Dahil dito, tinitiyak na ang anumang object na itinuturing na Flyable type ay magkakaroon ng fly method.

Mga Static na Miyembro

Kapag nagde-define ka ng static members sa isang class, ang mga methods at properties na iyon ay naka-associate mismo sa class. Ang mga static member ay maaaring tawagin kahit hindi nag-i-instantiate ng class.

 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

• Nagde-define ka ng static methods gamit ang keyword na static.
• Sa halimbawang ito, ang class na MathUtils ay nagde-define ng static method na add at static property na PI.
• Ang mga static member ay hindi kabilang sa mga class instance, ngunit maaaring tawagin direkta mula sa class mismo.

Buod

Nagdaragdag ang mga klase sa TypeScript ng mga tampok tulad ng type safety, access modifiers, at abstract classes sa functionality ng JavaScript class. Pinapayagan nito ang mas makapangyarihan at mas ligtas na object-oriented na programming.

Maaari mong sundan ang artikulo sa itaas gamit ang Visual Studio Code sa aming YouTube channel. Paki-check din ang aming YouTube channel.

YouTube Video