TypeScript – interface 概念: TypeScript介面定義對象的類型(我的理解:定義對象屬性的類型和提煉類中的公用方法) 類別:
介面的可選屬性: 介面中的屬性不全是必須的, 帶有可選屬性的介面和普通的介面差不多, 只是在可選屬性後添加 ’ 。’
// 可選屬性的介面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"});console.log(mySquare); 唯讀屬性: 介面中的一些屬性只能在對象剛剛建立時修改其值, 在唯讀屬性前 添加 ’ readonly’ TypeScript具有ReadonlyArray類型,它與Array相似,只是把所有可變方法去掉了,因此可以確保數組建立後再也不能被修改:
// 唯讀屬性的介面interface Point { readonly x : number; readonly y : number; }export class AppComponent implements OnInit { // 唯讀屬性的介面 readonlyFun(): void { console.log("這是唯讀屬性的介面"); let p1: Point = {x: 10, y: 10}; console.log(p1); // error // p1.x = 5; // ReadonlyArray<number> let a: number[] = [1,2,3,4]; let ro: ReadonlyArray<number> = a; console.log(ro); // ro[0] = 12; }
const: 用於目標標識符是變數
readonly: 用於目標標識符是對象屬性 函數類型介面: 給介面定義一個呼叫簽章。 它就像是一個只有參數列表和傳回值類型的函數定義。參數列表裡的每個參數都需要名字和類型 函數的參數名不需要與介面裡定義的名字相匹配
// 函數類型 interface SearchFunc { (source: string, subString: string): boolean; }export class AppComponent implements OnInit { // 函數類型 sou: string, sub: string mySearch: SearchFunc = function (source: string, subString: string) { let result = source.search(subString); return result > -1; } ngOnInit() { console.log(this.mySearch('nihao1234566', 'nihao')); }} 索引類型的介面: 可索引類型具有一個索引簽章,它描述了對象索引的類型,還有相應的索引傳回值類型。
// 索引類型interface StringArry { [index: number]: string;}export class AppComponent implements OnInit { // 索引類型 stringArray(): void { let myArry: StringArry; myArry = ["Bod", "Fred"]; let myStr: string = myArry[0]; console.log(myStr); } ngOnInit() { this.stringArray(); }} 介面繼承: 介面之間可以相互繼承 混合類型: 介面屬性可以是多種類型 介面繼承類: 介面繼承類中的成員(包括私人和公有),實現介面只能由其子類實現