Klasser i TypeScript

Denna artikel förklarar klasser i TypeScript.

YouTube Video

Klasser i TypeScript

Klasser i TypeScript är baserade på JavaScripts ES6-klasser och erbjuder ytterligare funktioner som typannoteringar och åtkomstmodifierare. Detta gör det möjligt att använda koncept inom objektorienterad programmering samtidigt som det ger starkare och tydligare typesäkerhet.

Nedan följer förklaringar av grundläggande användning och funktioner hos klasser i TypeScript.

Grundläggande klassdefinition

 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 och age är egenskaper (medlemsvariabler) i klassen.
• constructor är en metod som anropas när en instans av en klass skapas. Den tar argument och tilldelar värden till egenskaper.
• greet är en metod i klassen som indikerar att den inte har något returvärde genom att vara av typen void.

Åtkomstmodifierare

I TypeScript kan du använda åtkomstmodifierare (public, private, protected) för att kontrollera åtkomst till klassens egenskaper och metoder.

public

Som standard är alla egenskaper och metoder public. Detta innebär att de kan nås utanför klassen.

 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.

• species-egenskapen och makeSound-metoden är deklarerade som public och kan nås utanför klassen.

private

Genom att använda modifieraren private förhindras åtkomst till egenskaperna eller metoderna utanför klassen.

 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

• brand-egenskapen är deklarerad som private, så den kan inte nås utanför klassen.
• Inkapsling av data kan uppnås genom att dölja egenskaper med private-modifikatorn.

protected

Modifieraren protected begränsar åtkomst utanför klassen men tillåter det i underklasser (härledda klasser).

 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.

• model-egenskapen är deklarerad som protected, så den kan inte nås utanför klassen, men kan nås från underklasser.

Getters och Setters

I TypeScript kan du definiera getters och setters med hjälp av nyckelorden get och set för att hämta och ändra värden för egenskaper.

 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.

• I det här exemplet används en getter och setter för salary-egenskapen för att kontrollera extern åtkomst och uppdateringar. Settern utför validering för att förhindra negativa värden och visar ett varningsmeddelande om ett ogiltigt värde anges.

Arv

I TypeScript kan klasser ärvas. Med hjälp av nyckelordet extends kan du ärva funktionalitet från en föräldraklass.

 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.

• I det här exemplet ärver Bird-klassen från Animal-klassen, vilket gör att den kan använda move-metoden från Animal. Dessutom definierar den sin egen fly-metod, vilket lägger till ny funktionalitet samtidigt som den ärver egenskaper från basklassen.

Abstrakta klasser

Abstrakta klasser (abstract) kan inte instansieras direkt och används som mallar för att ge konkreta implementationer i underklasser.

 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.

• I det här exemplet definieras Shape som en abstrakt klass, och getArea är en abstrakt metod som måste implementeras av underklasser. Circle-klassen ärver denna abstrakta klass och implementerar sin egen getArea-metod för att beräkna cirkelns area. Dessutom ärvs konkreta metoder som describe som gemensam funktionalitet och kan användas som de är.

Relation med gränssnitt

Klasser kan implementera gränssnitt och säkerställa att de har specifika egenskaper och metoder.

 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.

• I det här exemplet definierar Flyable-gränssnittet specifikationen för fly-metoden och Airplane-klassen implementerar detta gränssnitt genom att tillhandahålla en konkret definition för fly-metoden. Med detta är det garanterat att alla objekt som kan behandlas som en Flyable-typ har en fly-metod.

Statiska medlemmar

När du definierar statisk medlemmar i en klass är dessa metoder och egenskaper kopplade till själva klassen. Statiska medlemmar kan anropas utan att instansiera klassen.

 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

• Du definierar statiska metoder med nyckelordet static.
• I detta exempel definierar klassen MathUtils en statisk metod add och en statisk egenskap PI.
• Statiska medlemmar tillhör inte klassens instanser, utan kan anropas direkt från själva klassen.

Sammanfattning

TypeScript-klasser lägger till funktioner som typ-säkerhet, åtkomstmodifierare och abstrakta klasser till JavaScript-klassernas funktionalitet. Detta möjliggör mer kraftfull och säkrare objektorienterad programmering.

Du kan följa med i artikeln ovan med hjälp av Visual Studio Code på vår YouTube-kanal. Vänligen kolla även in YouTube-kanalen.

YouTube Video