TypeScript 接口

TypeScript 接口定義如下：

interface interface_name { 
}

以下實例中，我們定義了一個接口 IPerson，接著定義了一個變量 customer，它的類型是 IPerson。

customer 實現(xiàn)了接口 IPerson 的屬性和方法。

interface IPerson { firstName:string, lastName:string, sayHi: ()=>string 
} var customer:IPerson = { firstName:"Tom",lastName:"Hanks", sayHi: ():string =>{return "Hi there"} 
} console.log("Customer 對象 ") 
console.log(customer.firstName) 
console.log(customer.lastName) 
console.log(customer.sayHi())  

聯(lián)合類型和接口

以下實例演示了如何在接口中使用聯(lián)合類型：

interface RunOptions { program:string; commandline:string[]|string|(()=>string); 
} 

這里commandline可以使字符串數(shù)組，字符串，或者函數(shù)表達式

接口和數(shù)組

接口中我們可以將數(shù)組的索引值和元素設置為不同類型，索引值可以是數(shù)字或字符串。

設置元素為字符串類型：

interface namelist { [index:number]:string 
} // 類型一致，正確
var list2:namelist = ["Google","Runoob","Taobao"]

?

接口繼承

接口繼承就是說接口可以通過其他接口來擴展自己。

Typescript 允許接口繼承多個接口。

繼承使用關鍵字?extends。

單接口繼承語法格式：

Child_interface_name extends super_interface_name

多接口繼承語法格式：

Child_interface_name extends super_interface1_name, super_interface2_name,…,super_interfaceN_name

繼承的各個接口使用逗號?,?分隔。

interface Person { age:number 
} interface Musician extends Person { instrument:string 
} var drummer = <Musician>{}; 
drummer.age = 27 
drummer.instrument = "Drums" 

TypeScript 類

TypeScript 是面向?qū)ο蟮?JavaScript。

類描述了所創(chuàng)建的對象共同的屬性和方法。

TypeScript 支持面向?qū)ο蟮乃刑匦?#xff0c;比如 類、接口等。

TypeScript 類定義方式如下：

class class_name { // 類作用域
}

定義類的關鍵字為 class，后面緊跟類名，類可以包含以下幾個模塊（類的數(shù)據(jù)成員）：

• 字段?? 字段是類里面聲明的變量。字段表示對象的有關數(shù)據(jù)。

• 構造函數(shù)?? 類實例化時調(diào)用，可以為類的對象分配內(nèi)存。

• 方法?? 方法為對象要執(zhí)行的操作。

class Car { // 字段engine:string; // 構造函數(shù)constructor(engine:string) { this.engine = engine }  // 方法disp():void { console.log("函數(shù)中顯示發(fā)動機型號  :   "+this.engine) } 
} // 創(chuàng)建一個對象
var obj = new Car("XXSY1")// 訪問字段
console.log("讀取發(fā)動機型號 :  "+obj.engine)  // 訪問方法
obj.disp()

類的繼承

TypeScript 支持繼承類，即我們可以在創(chuàng)建類的時候繼承一個已存在的類，這個已存在的類稱為父類，繼承它的類稱為子類。

類繼承使用關鍵字?extends，子類除了不能繼承父類的私有成員(方法和屬性)和構造函數(shù)，其他的都可以繼承。

TypeScript 一次只能繼承一個類，不支持繼承多個類，但 TypeScript 支持多重繼承（A 繼承 B，B 繼承 C）。

class child_class_name extends parent_class_name

繼承類的方法重寫

   doPrint():void { super.doPrint() // 調(diào)用父類的函數(shù)console.log("子類的 doPrint()方法。")

static 關鍵字

static 關鍵字用于定義類的數(shù)據(jù)成員（屬性和方法）為靜態(tài)的，靜態(tài)成員可以直接通過類名調(diào)用。

   static num:number; static disp():void { console.log("num 值為 "+ StaticMem.num) } 

?instanceof 運算符

class Person{ } 
var obj = new Person() 
var isPerson = obj instanceof Person; 
console.log("obj 對象是 Person 類實例化來的嗎？ " + isPerson);

訪問控制修飾符

TypeScript 中，可以使用訪問控制符來保護對類、變量、方法和構造方法的訪問。TypeScript 支持 3 種不同的訪問權限。

• public（默認）?: 公有，可以在任何地方被訪問。

• protected?: 受保護，可以被其自身以及其子類訪問。

• private?: 私有，只能被其定義所在的類訪問。

class Encapsulate { str1:string = "hello" private str2:string = "world" 
}var obj = new Encapsulate() 
console.log(obj.str1)     // 可訪問 
console.log(obj.str2)   // 編譯錯誤， str2 是私有的

類和接口

類可以實現(xiàn)接口，使用關鍵字 implements，并將 interest 字段作為類的屬性使用。

以下實例中 AgriLoan 類實現(xiàn)了 ILoan 接口：

interface ILoan { interest:number 
} class AgriLoan implements ILoan { interest:number rebate:number constructor(interest:number,rebate:number) { this.interest = interest this.rebate = rebate } 
} var obj = new AgriLoan(10,1) 
console.log("利潤為 : "+obj.interest+"，抽成為 : "+obj.rebate )

TypeScript 對象

對象是包含一組鍵值對的實例。 值可以是標量、函數(shù)、數(shù)組、對象等，如下實例：

var object_name = { key1: "value1", // 標量key2: "value",  key3: function() {// 函數(shù)}, key4:["content1", "content2"] //集合
}

TypeScript 類型模板

假如我們在 JavaScript 定義了一個對象：

var sites = {site1: "Runoob",site2: "Google",sayHello: function () { } // 類型模板
};
sites.sayHello = function () {console.log("hello " + sites.site1);
};
sites.sayHello();

通過類型目標可以動態(tài)添加方法和實現(xiàn)方式

鴨子類型(Duck Typing)

鴨子類型（英語：duck typing）是動態(tài)類型的一種風格，是多態(tài)(polymorphism)的一種形式。

在這種風格中，一個對象有效的語義，不是由繼承自特定的類或?qū)崿F(xiàn)特定的接口，而是由"當前方法和屬性的集合"決定。

interface IPoint { x:number y:number 
} 
function addPoints(p1:IPoint,p2:IPoint):IPoint { var x = p1.x + p2.x var y = p1.y + p2.y return {x:x,y:y} 
} // 正確
var newPoint = addPoints({x:3,y:4},{x:5,y:1})  // 錯誤 
var newPoint2 = addPoints({x:1},{x:4,y:3})