TypeScript基礎入門 - 接口 - 類類型

轉載地址

TypeScript基礎入門 - 接口 - 類類型

項目實踐倉庫

https://github.com/durban89/typescript_demo.git
tag: 1.0.12

爲了保證後面的學習演示須要安裝下ts-node，這樣後面的每一個操做都能直接運行看到輸出的結果。

npm install -D ts-node

後面本身在練習的時候能夠這樣使用

npx ts-node src/learn_basic_types.ts

npx ts-node 腳本路徑

接口

TypeScript的核心原則之一是對值所具備的結構進行類型檢查。 它有時被稱作「鴨式辨型法」或「結構性子類型化」。 在TypeScript裏，接口的做用就是爲這些類型命名和爲你的代碼或第三方代碼定義契約。

類類型

實現接口

與C#或Java裏接口的基本做用同樣，TypeScript也可以用它來明確的強制一個類去符合某種契約。以下實現

interface SomeClassInterface {
    property1: string;
}

class implementSomeInterface implements SomeClassInterface {
    property1: string;
    constructor(arg1: number, arg2: number) {}
}

你也能夠在接口中描述一個方法，在類裏實現它，如同下面的setProperty1方法同樣：

interface SomeClassInterface {
    property1: string;
    // 設置property1
    setProperty1(p: string): any;
}

class implementSomeInterface implements SomeClassInterface {
    property1: string;
    constructor(arg1: number, arg2: number) {}
    setProperty1(p: string): any {
        this.property1 = p;
    }
}

接口描述了類的公共部分，而不是公共和私有兩部分。 它不會幫你檢查類是否具備某些私有成員。

類靜態部分與實例部分的區別

當你操做類和接口的時候，你要知道類是具備兩個類型的：靜態部分的類型和實例的類型。 你會注意到，當你用構造器簽名去定義一個接口並試圖定義一個類去實現這個接口時會獲得一個錯誤：以下

interface SomeConstructor {
    new (arg1: string, arg2: string): any
}

class SomeClass implements SomeConstructor {
    property1: string;
    constructor(arg1: string, arg2: string) {}
}

運行後報錯誤以下

⨯ Unable to compile TypeScript:
src/interface_7.ts(20,7): error TS2420: Class 'SomeClass' incorrectly implements interface 'SomeConstructor'.
  Type 'SomeClass' provides no match for the signature 'new (arg1: string, arg2: string): any'.

這裏由於當一個類實現了一個接口時，只對其實例部分進行類型檢查。 constructor存在於類的靜態部分，因此不在檢查的範圍內。所以，咱們應該直接操做類的靜態部分。 看下面的例子，咱們定義了兩個接口，SomeConstructor爲構造函數所用和SomeClassInterface爲實例方法所用。 爲了方便咱們定義一個構造函數createSomeFunc，它用傳入的類型建立實例。

interface SomeClassInterface {
    property1: string;
    // 設置property1
    setProperty1(p: string): any;
    getProperty1(): string;
}

interface SomeConstructor {
    new(arg1: string, arg2: string): SomeClassInterface
}

function createSomeFunc(ctr: SomeConstructor, arg1: string, arg2: string): SomeClassInterface {
    return new ctr(arg1, arg2)
}

class ImplementSomeInterface1 implements SomeClassInterface {
    property1: string;
    property2: string;
    constructor(arg1: string, arg2: string) {
        this.property1 = arg1;
        this.property2 = arg2;
    }
    setProperty1(p: string): any {
        this.property1 = p;
    }
    
    getProperty1() {
        return this.property1 + ' = implementSomeInterface1';
    }
}

class ImplementSomeInterface2 implements SomeClassInterface {
    property1: string;
    property2: string;
    constructor(arg1: string, arg2: string) {
        this.property1 = arg1;
        this.property2 = arg2;
    }
    setProperty1(p: string): any {
        this.property1 = p;
    }
    
    getProperty1() {
        return this.property1 + ' = implementSomeInterface2';
    }
}

let instance1 = createSomeFunc(ImplementSomeInterface1, 'arg1', 'arg2');
let instance2 = createSomeFunc(ImplementSomeInterface2, 'arg1', 'arg2');
console.log(instance1.getProperty1());
console.log(instance2.getProperty1());

運行後獲得的結果以下

arg1 = implementSomeInterface1
arg1 = implementSomeInterface2

由於createSomeFunc的第一個參數是SomeConstructor類型，在createSomeFunc(ImplementSomeInterface1, 'arg1', 'arg2')裏，會檢查ImplementSomeInterface1是否符合構造函數簽名。

我以爲這裏的話官方寫的有點複雜了，爲何必定要使用一個構造函數接口呢，好比下面

let instance3 = new ImplementSomeInterface2('arg1','arg2')
console.log(instance3.getProperty1());

同樣能夠實現實例化，而且調用方法函數

本實例結束實踐項目地址

https://github.com/durban89/typescript_demo.git
tag: 1.0.13