亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

TypeScript 初識 - 接口

gnehc / 1631人閱讀

摘要：接口的作用是聲明變量的結(jié)構(gòu)和方法，但不做具體的實現(xiàn)。這兩個使用場景不同。額外的屬性檢查從字面上的意思看，其實就是對接口未定義的屬性進(jìn)行檢查。上面的例子，定義了接口，它具有索引簽名。它不會幫你檢查類是否具有某些私有成員。

接口的作用是聲明變量的結(jié)構(gòu)和方法，但不做具體的實現(xiàn)。通常，接口會強(qiáng)制對所有成員進(jìn)行類型檢查，包括數(shù)量和類型：

interface Name {
    first: string;
    second: string;
}

let name: Name;
name = {
    first: "John",
    second: "Doe"
};

name = {
    // Error: "second is missing"
    first: "John"
};

name = {
    // Error: "second is the wrong type"
    first: "John",
    second: 1337
};
可選屬性

帶有可選屬性的接口與普通的接口定義差不多，只是在可選屬性名字定義的后面加一個 ? 符號：

interface Name {
    first?: string;
    second?: string;
}

let name: Name;
name = {
    // 只有 first 也不會報錯
    first: "John"
};
只讀屬性

一些對象屬性只能在對象剛剛創(chuàng)建的時候修改其值?？梢栽趯傩悦坝?readonly 來指定只讀屬性：

interface Point {
    readonly x: number;
    readonly y: number;
}
let p1: Point = { x: 10, y: 20 };
p1.x = 5; // error!

TypeScript 具有 ReadonlyArray 類型，它與 Array 相似，只是把所有可變方法去掉了，因此可以確保數(shù)組創(chuàng)建后再也不能被修改：

let a: number[] = [1, 2, 3, 4];
let ro: ReadonlyArray = a;
ro[0] = 12; // error!
ro.push(5); // error!
ro.length = 100; // error!
a = ro; // error!

readonly 針對一個對象的屬性，const 針對的是一個變量。這兩個使用場景不同。

額外的屬性檢查

從字面上的意思看，其實就是對接口未定義的屬性進(jìn)行檢查。

當(dāng)一個變量實現(xiàn)接口時，變量中存在了接口未定義的屬性時，TypeScript 會進(jìn)行報錯：

interface Point {
    x: number;
    y?: number;
}
// error!
const myPoint: Point = { x: 1, z: 3 };

要想繞過檢查，最簡單的方法就是使用類型斷言：

const myPoint: Point = { x: 1, z: 3 } as Point;

最佳的方法是定義接口的時候添加一個字符串索引簽名：

interface Point {
    x: number;
    y?: number;
    [propName: string]: any;
}
函數(shù)類型

可以使用接口表示函數(shù)類型，需要給接口定義一個調(diào)用簽名：

interface SearchFunc {
    (source: string, subString: string): boolean;
}
let mySearch: SearchFunc;
mySearch = function(source: string, subString: string) {
    const result = source.indexOf(subString);
    return result > -1;
};

和變量類型的接口不同，函數(shù)的參數(shù)名不需要與接口定義的名字相匹配。函數(shù)的參數(shù)會逐個進(jìn)行檢查，要求對應(yīng)位置上的參數(shù)類型是兼容的：

let mySearch: SearchFunc;
mySearch = function(src: string, sub: string): boolean {
    let result = src.indexOf(sub);
    return result > -1;
};

如果沒有指定類型，TypeScript 的類型系統(tǒng)會推斷出參數(shù)類型，因為函數(shù)直接賦值給了 SearchFunc 類型變量：

let mySearch: SearchFunc;
mySearch = function(src, sub) {
    let result = src.indexOf(sub);
    return result > -1;
};
可索引的類型

可索引類型具有一個 索引簽名，它描述了對象索引的類型，還有相應(yīng)的索引返回值類型。

interface StringArray {
    [index: number]: string;
}

let myArray: StringArray;
myArray = ["Bob", "Fred"];

let myStr: string = myArray[0];

上面的例子，定義了 StringArray 接口，它具有索引簽名。這個索引簽名表示了當(dāng)用 number 去索引 StringArray 時會得到 string 類型的返回值。

TypeScript 支持兩種索引簽名：字符串和數(shù)字?？梢酝瑫r使用兩種類型的索引，但是數(shù)字索引的返回值必須是字符串索引返回值類型的子類型。其實，這相當(dāng)于 JavaScript 對象的 key，數(shù)字類型會轉(zhuǎn)換成字符串類型再取值。

字符串索引簽名能夠很好的描述 dictionary 模式，并且也會確保所有屬性與其返回值類型相匹配：

interface NumberDictionary {
    [index: string]: number;
    length: number; // 可以，length 是 number 類型
    name: string; // 錯誤，name 的類型與索引類型返回值的類型不匹配
}

可以將索引簽名設(shè)置為只讀，這樣就防止了給索引賦值：

interface ReadonlyStringArray {
    readonly [index: number]: string;
}
let myArray: ReadonlyStringArray = ["Alice", "Bob"];
myArray[2] = "Mallory"; // error!
類類型

類可以使用 implements 關(guān)鍵字實現(xiàn)某一個接口：

interface Point {
    x: number;
    y?: number;
    getX(): number;
}

class MyPoint implements Point {
    constructor(x: number) {
        this.x = x;
    }

    x: number;

    getX(): number {
        return this.x;
    }
}

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

繼承接口

接口之間可以相互繼承，并且一個接口還可以繼承多個接口，就是將一個接口里的成員復(fù)制到另一個接口中：

interface Shape {
    color: string;
}

interface PenStroke {
    penWidth: number;
}

interface Square extends Shape, PenStroke {
    sideLength: number;
}

let square = {};
square.color = "blue";
square.sideLength = 10;
square.penWidth = 5.0;
混合類型

一個對象可以同時具有多種類型。一個例子就是，一個對象可以同時做為函數(shù)和對象使用，并帶有額外的屬性：

interface Counter {
    (start: number): string;
    interval: number;
    reset(): void;
}

function getCounter(): Counter {
    let counter = function(start: number) {};
    counter.interval = 123;
    counter.reset = function() {};
    return counter;
}

let c = getCounter();
c(10);
c.reset();
c.interval = 5.0;

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

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/106847.html

相關(guān)文章

  • TypeScript 初識 - 類

    摘要：抽象類抽象類做為其它字類的基類使用，一般不會直接被實例化。抽象類中可以包含具體實現(xiàn)，接口不能。抽象類在運行時是可見的，可以通過判斷。接口只能描述類的公共部分，不會檢查私有成員，而抽象類沒有這樣的限制。 一個普通的類 class Greeter { greeting: string; constructor(message: string) { this....

    鄒強(qiáng) 評論0 收藏0

  • TypeScript 初識

    摘要：當(dāng)你陷在一個中大型項目中時應(yīng)用日趨成為常態(tài)，沒有類型約束類型推斷，總有種牽一發(fā)而動全身的危機(jī)和束縛。總體而言，這些付出相對于代碼的健壯性和可維護(hù)性，都是值得的。目前主流的都為的開發(fā)提供了良好的支持，比如和。參考資料中文文檔 文章博客地址：http://pinggod.com/2016/Typescript/ TypeScript 是 JavaScript 的超集，為 JavaScrip...

    iliyaku 評論0 收藏0

  • TypeScript 初識 - 內(nèi)置對象

    摘要：自帶的內(nèi)置對象都可以直接在中當(dāng)作定義好的類型。的內(nèi)置對象標(biāo)準(zhǔn)提供了常用的內(nèi)置對象等。在不需要額外引入就可以直接使用這些內(nèi)置對象用寫不是內(nèi)置對象的一部分，想要寫時提示，需要引入第三方聲明文件 JavaScript 自帶的內(nèi)置對象都可以直接在 TypeScript 中當(dāng)作定義好的類型。 TypeScript 核心庫的定義文件 TypeScript 核心庫的定義文件定義了所有瀏覽器環(huán)境需要用...

    lordharrd 評論0 收藏0

  • TypeScript 初識 - 基礎(chǔ)

    摘要：安裝通過命令進(jìn)行安裝創(chuàng)建文件文件名以擴(kuò)展名結(jié)尾編譯通過命令行進(jìn)行編譯通過運行任務(wù)的方式進(jìn)行編譯下使用顯示運行任務(wù)，選擇構(gòu)建進(jìn)行編譯。 安裝 通過 npm 命令進(jìn)行安裝： $ npm i -g typescript 創(chuàng)建 ts 文件 Typescript 文件名以 ts 擴(kuò)展名結(jié)尾： function hello(value: string) { console.log(`hel...

    CODING 評論0 收藏0

  • TypeScript 初識 - 函數(shù)

    摘要：函數(shù)類型函數(shù)返回值類型我們可以給每個參數(shù)添加類型之后再為函數(shù)本身添加返回值類型。能夠根據(jù)返回語句自動推斷出返回值類型，所以通常可以省略它匿名函數(shù)完整函數(shù)類型完整的函數(shù)類型包含兩部分參數(shù)類型和返回值類型。 函數(shù)是 JavaScript 的第一等公民，函數(shù)在 JavaScript 中可以實現(xiàn)抽象層、模擬類、信息隱藏和模塊等等。TypeScript 在一定基礎(chǔ)上擴(kuò)展了函數(shù)的功能。 函數(shù)類型 ...

    ARGUS 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<