国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

TypeScript入門-接口

2019-11-19 16:59:12
字體:
來源:轉載
供稿:網友

大致介紹

在TypeScript里,接口的作用就是為這些類型命名和為你的代碼或第三方代碼定義契約。

接口

例子:

  function printLabel(labelledObj: { label: string }) {   console.log(labelledObj.label);  }  let myObj = { size: 10, label: "Size 10 Object" };  printLabel(myObj);

printLabel函數有一個參數,要求這個參數是個對象,并且有一個屬性名為label的類型為string的屬性

有時我們會傳入多個參數,但是只檢測指定的參數有沒有

用接口來實現上面的例子:

interface LabelledValue {   label: string;  }  function printLabel(labelledObj: LabelledValue) {   console.log(labelledObj.label);  }  let myObj = {size: 10, label: "Size 10 Object"};  printLabel(myObj);

注意:要用到關鍵字 interface

可選屬性

有時接口里的屬性不是必須的是可選的,那么只要加個?就可以了

interface SquareConfig {   color?: string;   width?: number;  }  function createSquare(config: SquareConfig): {color: string; area: number} {   let newSquare = {color: "white", area: 100};   if (config.color) {    newSquare.color = config.color;   }   if (config.width) {    newSquare.area = config.width * config.width;   }   return newSquare;  }  let mySquare = createSquare({color: "black"});

上面的代碼中 config:SquareConfig規定了函數參數, {color: string;area: numner}規定了函數返回值的類型

使用可選屬性的好處:

1、可以對可能存在的屬性進行定義

2、可以捕獲訪問不存在的屬性時的錯誤

只讀屬性

如果向讓一個值只讀,不可以修改就可以使用readonly

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

TypeScript具有ReadonlyArray<number>類型,它與Array<T>相似,只是把怕有可變方法去掉了,因此可以確保數組創建后再也不能被修改:

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

額外的屬性檢查

看一個例子:

interface SquareConfig {    color?: string;    width?: number;  }  function createSquare(config: SquareConfig): { color: string; area: number } {    // ...  }  let mySquare = createSquare({ colour: "red", width: 100 });

起初會認為這個是對的,接口定義了兩個可選屬性color和width。函數實際傳入了width屬性和一個接口沒有定義的colour屬性,但是這段代碼會報錯。

對象字面量會被特殊對待而且會經過額外屬性檢查,當將它們賦值給變量或作為參數傳遞的時候。 如果一個對象字面量存在任何“目標類型”不包含的屬性時,你會得到一個錯誤。

最好的解決辦法就是添加一個字符串索引簽名

  interface SquareConfig {    color?: string;    width?: number;    [propName: string]: any;  }

函數類型

例子:

interface SearchFunc {   (source: string, subString: string): boolean;  }  let mySearch: SearchFunc;  mySearch = function(src, sub) {    let result = src.search(sub);    if (result == -1) {      return false;    }    else {      return true;    }  }

可索引的類型

可索引類型比如a[10]或obj['a']。 可索引類型具有一個索引簽名,它描述了對象索引的類型,還有相應的索引返回值類型。

interface StringArray {   [index: number]: string;  }  let myArray: StringArray;  myArray = ["Bob", "Fred"];  let myStr: string = myArray[0];

以上就是本文的全部內容,希望本文的內容對大家的學習或者工作能帶來一定的幫助,同時也希望多多支持武林網!

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 通辽市| 邹城市| 望城县| 平阴县| 上高县| 托克逊县| 长白| 广平县| 鄂尔多斯市| 九寨沟县| 康马县| 平塘县| 巴彦县| 永修县| 灌云县| 白河县| 通许县| 喀喇| 锦州市| 靖西县| 兴和县| 中宁县| 民和| 尼木县| 东方市| 江西省| 巍山| 莱州市| 仲巴县| 阿合奇县| 乌兰浩特市| 静宁县| 朔州市| 西林县| 新源县| 伊吾县| 资兴市| 宜昌市| 景谷| 三河市| 普格县|