Angular2對比于Angular1就像是Java與Javascript僧凰，正因?yàn)樽兓薮笫率荆肁ngularJS來代表1.x版本撮胧，而Angular代表2.x、4.x讥巡、5.x等后續(xù)版本掀亩。參考《Angular權(quán)威教程》記錄一下Angular家族史，本文簡介一下TypeScript欢顷。
TypeScript
Angular是用一種類似于JavaScript的語言--TypeScript構(gòu)建的槽棍。
TypeScript并不是一門全新的語言，而是ES6的超集抬驴。所有ES6代碼都是完全有效且可編譯的TypeScript代碼炼七。
TypeScript相對于ES5有五大改善：
- 類型
- 類
- 注解
- 模塊導(dǎo)入
- 語言工具包
類型
TypeScript的類型是可選的。
不過布持，類型檢查的好處在于：
1 有助于代碼的編寫特石，在編譯期預(yù)防bug
2 有助于代碼的閱讀，清晰的表達(dá)作者意圖
字符串
字符串包含文本鳖链，聲明為string類型：
var name: string = 'hello world!';
數(shù)字
無論整數(shù)還是浮點(diǎn)姆蘸，在TypeScript中，所有數(shù)據(jù)都是用浮點(diǎn)數(shù)表示：
var age: number = 25;
數(shù)組
數(shù)組用Array類型表示芙委，因?yàn)閿?shù)組是一組相同數(shù)據(jù)類型的集合逞敷，所以還需要為數(shù)組中的項(xiàng)目指定一個類型
var arr: Array<string> = ['component', 'provider', 'pipe'];
或
var arr: string[] = ['component', 'provider', 'pipe'];
var arr: Array<number> = [1, 2, 3, 4, 5, 6];
或
var arr: number[] = [1, 2, 3, 4, 5, 6];
枚舉
枚舉是一組可命名數(shù)值的集合，
enum Man {age, iq, eq};
var man: Man = Man.age;
任意類型
如果沒有為變量指定類型灌侣，那它的默認(rèn)類型就是any推捐，any類型的變量能夠接收任意類型的數(shù)據(jù)
var something: any = 'hello world';
something = 1;
something = [1, 2, 3];
"無"類型
void表示不期望那里有類型，通常用作函數(shù)的返回值侧啼，表示沒有任何返回值
function setName(name: string): void {
this.name = name;
}
void類型也是一種合法的any類型
類
es5中采用的是基于原型的面向?qū)ο笤O(shè)計(jì)牛柒，并不使用類堪簿，而是依賴于原型
在es6中可以使用class表示內(nèi)置的類，如：
class Point {
}
類可以包含屬性皮壁、方法以及構(gòu)造函數(shù)
屬性
屬性定義了類實(shí)例對象的數(shù)據(jù)椭更，如：Point類中可以有x、y屬性
類中的每個屬性都可以包含一個可選的類型蛾魄，如：
class Point {
x: number;
y: number;
}
方法
方法是執(zhí)行在類對象實(shí)例上下文中的函數(shù)虑瀑，在調(diào)用對象的方法前，要有這個對象的實(shí)例
class Point {
x: number;
y: number;
moveTo(x: number, y: number) {
this.x = x;
this.y = y;
console.log(this.x, this.y);
}
}
var p: Point = new Point();
p.x = 1;
p.y = 1;
p.moveTo(10,10);
構(gòu)造函數(shù)
構(gòu)造函數(shù)是當(dāng)類進(jìn)行實(shí)例化時執(zhí)行的特殊函數(shù)滴须，通常會在構(gòu)造函數(shù)中對新對象進(jìn)行初始化
構(gòu)造函數(shù)必須命名為constructor舌狗，因?yàn)闃?gòu)造函數(shù)在類被實(shí)例化時調(diào)用，所以可以有輸入?yún)?shù)扔水，但不能有返回值
當(dāng)類沒有顯式定義構(gòu)造函數(shù)時痛侍，將自動創(chuàng)建一個無參構(gòu)造函數(shù)
class Point {
}
var p = new Point();
等價于
class Point {
constructor() {
}
}
var p = new Point();
帶參構(gòu)造函數(shù)
class Point {
x: number;
y: number;
constructor(x: number, y: number) {
this.x = x;
this.y = y;
}
moveTo(x: number, y: number) {
this.x = x;
this.y = y;
console.log(this.x, this.y);
}
}
var p: Point = new Point(1,1);
p.moveTo(10,10);
繼承
面向?qū)ο蟮牧硪恢匾匦跃褪抢^承，繼承表明子類能夠從父類得到它的行為魔市，然后可以在這個子類中重寫恋日、修改或添加行為
TypeScript完成支持繼承特性，用extends關(guān)鍵字實(shí)現(xiàn)
創(chuàng)建父類
class Parent {
name: string;
constructor(name: string){
this.name = name;
}
say() {
console.log('NAME:' + this.name);
}
}
子類
class Child {
age: number;
constructor(name: string, age: number) {
super(name);
this.age = age;
}
say() {
super.say();
console.log(' AGE:' + this.age);
}
}
var n: Child = new Child('vist', 25);
n.say();
總結(jié)
在TypeScript和ES6中還有很多優(yōu)秀的語法特性嘹狞，序幕才剛剛拉開。
