成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

TypeScript入門-類

longmon / 1785人閱讀

摘要:可以使用關(guān)鍵字來定義類的靜態(tài)屬性,示例代碼如下輸出輸出抽象類有抽象類的概念,他是供其他類繼承的基類,不能直接實(shí)例化。抽象類必須包含一些抽象方法,同時(shí)也可以包含非抽象的成員。

學(xué)習(xí)Angular 2 , 《揭秘Angular 2》讀書筆記。Angular2 選擇 TypeScript 作為其官方最主要的構(gòu)建語音,這意味著掌握 TypeScript 語音將更有利于高效地開發(fā) Angular 應(yīng)用。

傳統(tǒng)的 JavaScript 程序是使用函數(shù)和基于原型(Prototype)繼承來創(chuàng)建可重用的“類”,這對(duì)于習(xí)慣面向?qū)ο缶幊痰拈_發(fā)者來說并不友好。TypeScript 中可以支持使用基于類的面向?qū)ο缶幊獭?/p>

類的例子

示例代碼如下:

class Car {
    engine: string;
    constructor(engine: string) {
        this.engine = engine;
    }
    drive(distanceInMeters: number = 0) {
        console.log(`A car runs ${ distanceInMeters }m powered by` + this.engine);
    }
}

上面聲明了一個(gè)汽車類,這個(gè)類有三個(gè)類成員:

類屬性 engine,可通過 this.engine 訪問

構(gòu)造函數(shù) constructor

方法 drive

下面實(shí)例化一個(gè)Car的對(duì)象,通過執(zhí)行構(gòu)造函數(shù)對(duì)其初始化。

let car = new Car("petrol");
car.drive(100); // 輸出:A car runs 100m powered by petrol

繼承與多態(tài)

封裝、繼承、多態(tài)是面向?qū)ο蟮娜齻€(gè)特性。上面的例子中把汽車的行為寫到一個(gè)類中,即所謂的封裝。在 TypeScript 中,使用 extends 關(guān)鍵字即可方便地實(shí)現(xiàn)繼承。示例代碼如下:

// 繼承自前文的 Car 類
class MotoCar extends Car {
    constructor(engine: string) { super(engine); }
}

class Jeep extends Car {
    constructor(engine: string) { super(engine); }
    drive(distanceInMeters: number = 100) {
        console.log("Jeep...")
        retrun super.drive(distanceInMeters);
    }
}

let tesla = new MotoCar("electricity");
let landRover: Car = new Jeep("petrol");

tesla.drive();    // 調(diào)用父類的 drive() 方法
landRover.drive(200);    // 調(diào)用子類的 drive() 方法

從上面的例子可以看到,MotoCar 和 Jeep 是基類Car的子類,通過 extends 來繼承父類,子類可以訪問父類的屬性和方法,也可以重寫父類的方法。Jeep 類重寫了父類的 drive() 方法,這樣 drive() 方法在不同的類中就具有不同的功能,這就是多態(tài)。

修飾符

在類中的修飾器可以分為公共(public)、私有(private)和受保護(hù)(protected)三種類型。

public 修飾符
在 TypeScript 里,每個(gè)成員默認(rèn)為 public,可以被自由訪問,我們也可以顯式地給 Car 類里定義的成員加上 public 修飾符,示例代碼如下:

class Car {
    public engine: string;
    public constructor(engine: string) {
        this.engine = engine;
    }
    public drive(distanceInMeters: number = 0) {
        console.log(`A car runs ${ distanceInMeters }m powered by` + this.engine);
    }
}

private 修飾符
當(dāng)類成員被標(biāo)記為 private 時(shí),就不能在類的外部訪問它,示例代碼如下:

class Car {
    private engine: string;
    constructor(engine: string) {
        this.engine = engine;
    }
}

new Car("petrol").engine;    // 報(bào)錯(cuò):engine 屬性是私有的,只能在類內(nèi)部訪問

protected 修飾符
protected 修飾符與 private 修飾符的行為很相似,但有一點(diǎn)不同,protected 成員在派生類中仍然可以訪問,示例代碼如下:

class Car {
    private engine: string;
    constructor(engine: string) {
        this.engine = engine;
    }
    drive(distanceInMeters: number = 0) {
        console.log(`A car runs ${ distanceInMeters }m powered by` + this.engine);
    }
}
class MotoCar extends Car {
    constructor(engine: string) { super(engine); }
    drive(distanceInMeters: number = 100) {
        super.drive(distanceInMeters);
    }
}
let tesla = new MotoCar("electricity");
console.log(tesla.drive());    // 正常
console.log(tesla.engine);    // 報(bào)錯(cuò)

靜態(tài)屬性

類的靜態(tài)成員存在于類本身而不是類的實(shí)例上,我們使用 類名. 來訪問靜態(tài)屬性。可以使用 static 關(guān)鍵字來定義類的靜態(tài)屬性,示例代碼如下:

class Grid {
    static origin = {x: 0, y: 0};
    constructor(public scale: number) {}
    calculateDistanceFromOrigin(point: {x: number; y: number;}) {
        let xDist = (point.x - Grid.origin.x);
        let yDist = (point.y - Grid.origin.y);
        return Math.sqrt(xDist * xDist + yDist * yDist) / this.scale;
    }
}
let grid1  = new Grid(1.0);

let grid2  = new Grid(5.0);

// 輸出:14.142...
console.log(grid1.calculateDistanceFromOrigin({x: 10, y: 10}));
// 輸出:2.828...
console.log(grid2.calculateDistanceFromOrigin({x: 10, y: 10}));

抽象類

TypeScript 有抽象類的概念,他是供其他類繼承的基類,不能直接實(shí)例化。抽象類必須包含一些抽象方法,同時(shí)也可以包含非抽象的成員。abstract 關(guān)鍵字用于定義抽象類和抽象方法。抽象類中的抽象方法不包含具體實(shí)現(xiàn),但是必須在派生類中實(shí)現(xiàn),示例代碼如下:

abstract class Person {
    abstract speak(): void;    // 必須在派生類中實(shí)現(xiàn)
    walking(): void {
        console.log("Walking on the road");
    }
}

class Male extends Person {
    speak(): void {
        console.log("How are you?");
    }
}

let person: Person;    // 創(chuàng)建一個(gè)抽象類的引用
person = new Person();    // 報(bào)錯(cuò),不能創(chuàng)建抽象類實(shí)例
person = new Male();    // 創(chuàng)建一個(gè) Male 實(shí)例
person.speak();
person.walking();

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/82342.html

相關(guān)文章

  • TypeScript入門教程

    摘要:現(xiàn)在,出現(xiàn)了更多本身支持或者通過插件支持語法智能提示糾錯(cuò)甚至是內(nèi)置編譯器的文本編輯器和。 TypeScript是什么 TypeScript是JavaScript的一個(gè)超集 TypeScript需要編譯為JavaScript才能運(yùn)行(語法糖) TypeScript提供了類型系統(tǒng),規(guī)范類似Java TypeScript提供了ES6的支持,也可以支持部分ES7草案的特性,不用擔(dān)心TypeS...

    Dr_Noooo 評(píng)論0 收藏0
  • TypeScript入門-接口

    摘要:接口類型檢查不會(huì)去檢查屬性順序,但是屬性的必須存在且類型匹配。函數(shù)的返回值函數(shù)的返回值類型必須與接口定義的返回值保持一致。示例代碼如下張三李四張三輸出張三輸出張三索引簽名支持字符串和數(shù)字兩種數(shù)據(jù)類型。 學(xué)習(xí)Angular 2 , 《揭秘Angular 2》讀書筆記。Angular2 選擇 TypeScript 作為其官方最主要的構(gòu)建語音,這意味著掌握 TypeScript 語音將更有利...

    sewerganger 評(píng)論0 收藏0
  • TypeScript入門學(xué)習(xí)之路

    摘要:學(xué)習(xí)之路學(xué)習(xí)之路安裝環(huán)境起步開發(fā)工具自動(dòng)編譯文件中的數(shù)據(jù)類型中的函數(shù)中類的定義繼承中的繼承中的繼承類的靜態(tài)屬性和靜態(tài)方法類的多態(tài)的抽象類中的接口中的泛型學(xué)習(xí)之路安裝環(huán)境查看版本起步新建通過命令編譯此時(shí)路徑下 ...

    jemygraw 評(píng)論0 收藏0
  • TypeScript快速入門

    摘要:添加了可選的靜態(tài)類型注意并不是強(qiáng)類型和基于類的面向?qū)ο缶幊?。類類型接口示例接口更注重功能的設(shè)計(jì),抽象類更注重結(jié)構(gòu)內(nèi)容的體現(xiàn)模塊中引入了模塊的概念,在中也支持模塊的使用。 一:Typescript簡介 維基百科: TypeScript是一種由微軟開發(fā)的自由和開源的編程語言。它是JavaScript的一個(gè)嚴(yán)格超集,并添加了可選的靜態(tài)類型和基于類的面向?qū)ο缶幊?。C#的首席架構(gòu)師以及Delp...

    moven_j 評(píng)論0 收藏0
  • TypeScript極速完全入門-3ts結(jié)合react進(jìn)行項(xiàng)目開發(fā)

    摘要:前面我們已經(jīng)說了大部分的核心內(nèi)容,接下來我們就說說如何用開發(fā)實(shí)際項(xiàng)目。因?yàn)楹徒Y(jié)合很緊密,資料也很多,而且我會(huì)找機(jī)會(huì)專門說下這方面的知識(shí),所以我們將重點(diǎn)放到如何用結(jié)合上來。所以前面打牢基礎(chǔ),現(xiàn)在我們開始實(shí)際組建工作流。 前面我們已經(jīng)說了大部分typescript的核心內(nèi)容,接下來我們就說說如何用typescript開發(fā)實(shí)際項(xiàng)目。 因?yàn)閍ngular和typescript結(jié)合很緊密,資料也...

    arashicage 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<