前端學習入門-angular2-Typescript基本語法（二）
接口
接口的創建
interface labelValue{ label:string; }
//創建函數對接口進行調用 labelObj是函數形式參數 其類型是接口類型labelValue
function printLabel(labelObj:labelValue){
console.log(labelObj.label);
}
//創建對象 創建函數實參myObj
var myObj={label:"come on"};
//調用函數
printLabel(myObj)
接口的可選屬性
interfaceUSB{ name?:string; age?:number; } function printUSB(pu:USB){ console.log(pu.name); console.log(pu.age); } var me={name:‘jason‘}; printUSB(me);
接口描述函數類型
interface SearchFun{ //接口裏面是函數，有兩個形式參數source和subString,其類型都是string類型， //函數的返回值是boolean類型 (source:string,subString:string):boolean; } var mySearch:SearchFun; //變量類型是接口類型 mySearch=function(src:string,sub:string){ let result=src.search(sub); if(result!=-1){ return true; }else{ return false; } } [propName: string]: any; 任意屬性取 string 類型的值
用接口來描述數組類型
interfaceStringArray{ [index:number]:string; } let myArray:StringArray=[‘jason‘,‘john‘]; console.log(myArray);
接口的繼承與實現
interface Animal { name: string; eat(): void; } class Dog implements Animal { name: string; constructor(theName: string) { this.name = theName; } eat() { console.log(`${this.name} 吃狗糧。`) } } let dog: Animal; dog = new Dog(‘狗狗‘); dog.eat();
Class
下面看一個使用類的例子：
class Greeter { greeting: string; constructor(message: string) { this.greeting = message; } greet() { return "Hello, " + this.greeting; } } let greeter = new Greeter("world");
繼承
在TypeScript裏，我們可以使用常用的面向對象模式。 當然，基於類的程序設計中最基本的模式是允許使用繼承來擴展一個類。
看下面的例子：
class Animal { name:string; constructor(theName: string) { this.name = theName; } move(distanceInMeters: number = 0) { console.log(`${this.name} moved ${distanceInMeters}m.`); } } class Snake extends Animal { constructor(name: string) { super(name); } move(distanceInMeters = 5) { console.log("Slithering..."); super.move(distanceInMeters); } } class Horse extends Animal { constructor(name: string) { super(name); } move(distanceInMeters = 45) { console.log("Galloping..."); super.move(distanceInMeters); } } let sam = new Snake("Sammy the Python"); let tom: Animal = new Horse("Tommy the Palomino"); sam.move(); tom.move(34);
函數
普通函數
在TypeScript中，我們可以給函數指定類型，這樣在編譯階段會規避很多錯誤.函數類型分為參數類型和返回值類型，如下代碼所示，參數類型直接在參數後指定，返回值類型則在該函數後面指定。 TypeScript能夠根據返回語句自動推斷出返回值類型，因此我們通常省略它。
/*普通函數*/ function add(x:number,y:number):number{ return x+y; } add(1,2); /*匿名函數*/ var addFun=function (x:number,y:number):number { return x+y; } addFun(2,3);
完整函數類型
在TypeScript中，為了提高代碼的可讀性，提供給我們另一種寫法，這種寫法會明確的指出參數的意義。
如下代碼所示，我們很容易就明白這個方法傳的參數是數學分數和英語分數，該方法返回的是數學和英語分數的和。返回值類型是函數類型的必要部分，如果函數沒有返回任何值，你也必須指定返回值類型為 void而不能留空。
let add:(mathScores:number,englishScores:number)=>number =function (x:number,y:number):number { return x+y;}
Lambda表達式
也叫箭頭函數，就是用來聲明匿名函數，並且能消除傳統的javascript中匿名函數this指針問題。
1、/*簡單的箭頭函數 無參數且無返回值*/
var add = () => {console.log("無參數且無返回值")};
2、/*有一個參數 且有返回值*/
var add1=x=>`有一個參數的時候可以不寫()，${x}
ass`;
3、/*多個參數*/
var add2=(x,y,z)=>{ console.log(x+y+z); } add2(1,2,3);
泛型
function identity<T>(arg: T): T { return arg; }
我們給identity添加了類型變量T。 T幫助我們捕獲用戶傳入的類型（比如：number），之後我們就可以使用這個類型。 之後我們再次使用了T當做返回值類型。現在我們可以知道參數類型與返回值類型是相同的了。 這允許我們跟蹤函數裏使用的類型的信息。
我們把這個版本的identity函數叫做泛型，因為它可以適用於多個類型。 不同於使用any，它不會丟失信息，像第一個例子那像保持準確性，傳入數值類型並返回數值類型。
我們定義了泛型函數後，可以用兩種方法使用。 第一種是，傳入所有的參數，包含類型參數：
let output = identity<string>("myString"); // type of output will be ‘string‘
前端學習入門-angular2-Typescript基本語法（二）