本系列教程帶您逐步學習TypeScript。第一部分簡要介紹了TypeScript 並推薦了一些可用於編寫TypeScript 的IDE。第二部分重點介紹了數(shù)據(jù)類型，第三部分討論了TypeScript 接口的基礎(chǔ)知識。

您可能已經(jīng)知道，JavaScript 現(xiàn)在也原生支持類和麵向?qū)ο缶幊?。但是，TypeScript 長期以來都允許開發(fā)人員在其代碼中使用類。這段代碼隨後編譯成可在所有主要瀏覽器上運行的JavaScript 代碼。在本教程中，您將學習TypeScript 中的類。它們與其ES6 對應物類似，但更嚴格。

創(chuàng)建您的第一個類

讓我們從基礎(chǔ)開始。類是面向?qū)ο缶幊痰幕A(chǔ)部分。您可以使用類來表示任何具有某些屬性和函數(shù)的實體，這些函數(shù)可以作用於給定的屬性。 TypeScript 使您可以完全控制在其自身包含的類內(nèi)部和外部可訪問的屬性和函數(shù)。以下是如何創(chuàng)建類的基本示例。

您可能已經(jīng)註意到，構(gòu)造函數(shù)類似於get和name ，以及get但不是readonly 。如果未顯式指定，則設(shè)置器的參數(shù)類型將從getter 的返回類型推斷。從TypeScript 4.3 開始，您可以擁有一個設(shè)置器，它接受與getter 返回的類型不同的類型。

使用接口實現(xiàn)類

在我們之前的TypeScript 接口入門教程中，我們了解到接口基本上用於指定我們在代碼中將使用的不同對象的結(jié)構(gòu)?，F(xiàn)在，我們將學習如何基於一些先前聲明的接口實現(xiàn)類。

 interface IPoint {
    x: number;
    y: number;
    position(x: number, y: number): void
}

interface IRectangle extends IPoint {
    width: number;
    length: number;
    area(width: number, length: number): number
}

class Point implements IPoint {
    x: number;
    y: number;

    constructor(x: number, y: number) {
        this.x = x;
        this.y = y;
    }

    position(): void {
        console.log(`The point is at (${this.x}, ${this.y}).`);
    }
}

class Rectangle implements IRectangle {
    width: number;
    length: number;
    x: number;
    y: number;

    constructor(x: number, y: number, width: number, length: number) {
        this.x = x;
        this.y = y;
        this.width = width;
        this.length = length;
    }

    area(): number {
        return this.width * this.length;
    }

    position(): void {
        console.log(`The rectangle is at (${this.x}, ${this.y}).`);
    }
}

let myPoint = new Point(10, 20);

let myRect = new Rectangle(0, 0, 20, 30);

myPoint.position();

myRect.position();

console.log(myRect.area());

我們創(chuàng)建了一個IRectangle接口，就像我們在之前的教程中所做的那樣。這裡的一個額外更改是，我們還向接口添加了一個函數(shù)聲明。

IRectangle ，這意味著它將具有這四個屬性和兩個方法來輸出其位置和顯示其面積。

總結(jié)

在本教程中，我嘗試介紹TypeScript 中類的基礎(chǔ)知識。我們首先創(chuàng)建了一個非?；镜?code>Person類，它將人的姓名打印到控制臺中。之後，您學習了private關(guān)鍵字，該關(guān)鍵字可用於防止在程序的任意點訪問類的成員。

最後，您學習瞭如何使用繼承基類在代碼中擴展不同的類。您可以在官方文檔中了解更多關(guān)於類的信息。

以上是初學者的打字稿，第4部分：課程的詳細內(nèi)容。更多資訊請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！