一、簡介
1、TypeScript是什么
TypeScript是 JavaScript 的一個(gè)超集，主要提供了類型系統(tǒng)和對 ES6 的支持，由 Microsoft開發(fā)，可以編譯成純 JavaScript。
2、安裝TypeScript
命令行安裝方法：npm install -g typescript
編譯：tsc hello.ts
二、基礎(chǔ)
1、原始數(shù)據(jù)類型
JavaScript的類型分為兩種：原始數(shù)據(jù)類型和對象類型。
原始數(shù)據(jù)類型包括：boolean、number、string、null、undefined和 Symbol。
JavaScript沒有空值（void）的概念，在 TypeScript中，可以用void表示沒有任何返回值的函數(shù)。
例：
//布爾
let isDone:boolean=false;
//數(shù)值
let decLiteral:number=6;
//字符串
let myName:string='Tom';
//空值
function alertName():void{
alert('my name is Tom');
}
//null
let n:null=null;
//undefined
let u:undefined=undefined;
2、任意值（Any）
任意值用來表示允許賦值為任意類型，如果是一個(gè)普通類型，在賦值過程中改變類型是不被允許的。
例：
let myFavoriteNumber:any='seven';
myFavoriteNumbe=7;
3、類型推論
如果沒有明確的指定類型，TypeScript會(huì)依照類型推論的規(guī)則推斷出一個(gè)類型。
例：
let myFavoriteNumber='seven'; //等價(jià)于：let myFavoriteNumber: string = 'seven';
myFavoriteNumber=7; //error
4、聯(lián)合類型
聯(lián)合類型表示取值可以為多種類型中的一種，聯(lián)合類型使用 |分隔每個(gè)類型。
例：
let myFavoriteNumber:string | number;
myFavoriteNumber='seven';
myFavoriteNumber=7;
5、對象的類型——接口
在TypeScript 中，我們使用接口（Interfaces）來定義對象的類型。
接口是對行為的抽象，具體如何行動(dòng)需要由類（classes）去實(shí)現(xiàn)（implement）。
賦值的時(shí)候，變量的形狀必須和接口的形狀保持一致（不可多，不可少）。
不允許添加未定義的屬性。
例：
interface Person{
name:string;
age:number;
}
let tom:Person={
name:'Tom',
age:19
}
（1）可選屬性
不完全匹配一個(gè)形狀，可以用可選屬性。
例：
interface Person{
name:string;
age?:number; //age可有可無
}
let tom:Person={
name:'Tom'
}
（2）只讀屬性
可以用readonly定義只讀屬性。注意，只讀的約束存在于第一次給對象賦值的時(shí)候，而不是第一次給只讀屬性賦值的時(shí)候。
例：
interface Person{
readonly id:number;
name:string;
age?:number;
[propName:string]:any
}
let tom:Person={
id:89757,
name:'Tom',
gender:'male'
}
tom.id=9527; //error
6、數(shù)組類型
在 TypeScript中，數(shù)組類型有多種定義方式，比較靈活。
（1）類型+方括號表示法
let fibonacci:number[]=[1,1,2,3,5];
數(shù)組項(xiàng)不允許出現(xiàn)其它類型：
let fibonacci:number[]=[1,'1',2,3,5];
（2）數(shù)組泛型
可以使用數(shù)組泛型 Array<elemType> 來表示數(shù)組。
let fibonacci:Array<number>=[1,1,2,3,5];
(3)用接口表示數(shù)組
//NumberArray 表示：只要索引的類型是數(shù)字時(shí)，那么值的類型必須是數(shù)字。
interface NumberArray{
[index:number]:number;
}
let fibonacci:NumberArray=[1,1,2,3,5];
（4）類數(shù)組
類數(shù)組不是數(shù)組類型， 比如arguments。
function sum(){
let args:number[]=arguments;
}
（5）any在數(shù)組中的使用
用 any表示數(shù)組中允許出現(xiàn)任意類型。
let list:any[]=['Tom',19,{website:'http://www.baidu.com'}];
7、函數(shù)的類型
（1）函數(shù)聲明
注意，輸入多余的或者少于要求的參數(shù)，是不被允許的
funciton sum(x:number,y:number):number{
return x+y;
}
（2）函數(shù)表達(dá)式
let mySum=function(x:number,y:number):number{
return x+y;
}
給mySum添加類型：
let mySum:(x:number,y:number)=>number=function(x:number,y:number):number{
return x+y;
}
注意不要混淆了 TypeScript中的=>和ES6 中的 =>。
在TypeScript的類型定義中，=> 用來表示函數(shù)的定義，左邊是輸入類型，需要用括號括起來，右邊是輸出類型。
（3）用接口定義函數(shù)的形狀
interface SearchFunc{
(source:string,subString:string):boolean;
}
let mySearch:SearchFunc;
mySearch=function(source:string,subString:string){
return source.search(subString)!==-1;
}
（4）可選參數(shù)
需要注意的是，可選參數(shù)必須接在必需參數(shù)后面。換句話說，可選參數(shù)后面不允許再出現(xiàn)必需參數(shù)了。
function buildName(firstName:string,lastName?:string){
if(lastName){
return firstName+' '+lastName;
}else{
return firstName;
}
}
let tomcat=buildName('Tom','Cat');
let tom=buildName('Tom');
（5）參數(shù)默認(rèn)值
function buildName(firstName:string,lastName:string='Cat'){
return firstName+' '+lastName;
}
let tomcat=buildName('Tom','Cat');
let tom=buildName('Tom');
（6）剩余參數(shù)
items是一個(gè)數(shù)組。所以我們可以用數(shù)組的類型來定義它。
function push(array:any[],...items:any[]){
items.forEach(function(item)){
array.push(item);
}
}
let a=[];
push(a,1,2,3);
注意，rest參數(shù)只能是最后一個(gè)參數(shù)。
（7）重載
重載允許一個(gè)函數(shù)接受不同數(shù)量或類型的參數(shù)時(shí)，作出不同的處理。
function reverse(x:number):number;
function reverse(y:string):string;
function reverse(x:number|string):number|string{
if(typeof x==='number'){
return Number(x.toString().split('').reverse().join(''));
}else if(typeof x==='string'){
return x.split('').reverse().join('');
}
}
注意，TypeScript會(huì)優(yōu)先從最前面的函數(shù)定義開始匹配，所以多個(gè)函數(shù)定義如果有包含關(guān)系，需要優(yōu)先把精確的定義寫在前面。
8、類型斷言
類型斷言可以用來手動(dòng)指定一個(gè)值的類型。
語法：<類型> 值 或 值 as 類型
function getLength(something:string | number):number{
if((<string>something).length){
return (<string>something).length;
}else{
return something.toString().length;
}
}
