[TOC]
一.關(guān)于TypeScript
TypeScript是由微軟開發(fā)的自由和開源的編程語言，它是JavaScript的超集堪侯。它擴(kuò)展了JavaScript的語法，JavaScript的語法可以不加修飾的情況下，在TypeScript的環(huán)境下運(yùn)行巡揍。TypeScript添加了遵循es6的語法胚泌，以及基于類的面向?qū)ο缶幊痰倪@種特性瘟则。而且谷歌發(fā)布的Angular2也是TypeScript開發(fā)的.
TypeScript是為開發(fā)大型應(yīng)用而設(shè)計的,編譯的JavaScript保證兼容性。
- 微軟開發(fā)
- javascript超集
- 遵循es6規(guī)范
- 強(qiáng)類型
二.使用它的原因
由于JavaScript是一門弱類型語言,變量的數(shù)據(jù)具有動態(tài)性,無法準(zhǔn)確知道它的類型.TypeScript的類型機(jī)制可以避免這一類問題膜钓， 等嗽交！
TypeScript具強(qiáng)大的IDE支持，體現(xiàn)在
1.類型檢測
2.語法提示
３.重構(gòu)
重構(gòu):
TypeScript中引入了模塊的概念颂斜，這類似于C++中的名字空間夫壁。它可以把聲明、數(shù)據(jù)沃疮、函數(shù)和類封裝在模塊中盒让，并采用export關(guān)鍵字導(dǎo)出，供模塊外部的代碼取用司蔬。之所以說它和命名空間比較相似邑茄，一是因?yàn)橥哪K可以自動合并，甚至可以分別存儲在多個文件中俊啼；二是因?yàn)槟K的名字可以分成不同層次肺缕，在層次較多時還可以命名簡化的別名。但無論模塊怎么組織授帕，最終生成的還是標(biāo)準(zhǔn)的同木、可直接取用的JavaScript代碼。正是靠著模塊化跛十、可插拔的結(jié)構(gòu)彤路，TypeScript才得以在維護(hù)一個較小的語言核心的前提下，對廣泛使用的庫如jQuery芥映、CommonJS和Node.js等提供了完整的支持洲尊。
由于TypeScript并不是采用字符串匹配的粗糙方式來推導(dǎo)變量和函數(shù)的名字缝裤，對TypeScript代碼進(jìn)行命名的重構(gòu)就如同微軟的其他編程語言一樣容易。只需要選中要重新命名的實(shí)體颊郎，并鍵入新的名字，而不需要擔(dān)心名字相同而意義不同的其他實(shí)體也被同時重命名了
vscode
vscode搭建typescript開發(fā)環(huán)境
相比學(xué)習(xí)這門語言的付出霎苗，TypeScript諸多優(yōu)點(diǎn),都是值得的姆吭！
三.搭建TypScipt開發(fā)環(huán)境
因?yàn)?strong>TypeScript是編譯型語言，而且不能在瀏覽器上直接運(yùn)行唁盏，所以我們要安裝TypeScript的編譯器内狸，將它編譯成Javascript才能在瀏覽器上運(yùn)行。
在線編譯:
當(dāng)然你也可以使用在線的編譯器 => 點(diǎn)我
使用本地編譯器：
使用本地編譯你需要安裝TS ,
安裝:
sudo npm install -g typescript
安裝完成后你可以測試是否安裝成功厘擂，當(dāng)然一般情況都沒有什么問題的
tsc --version
Version 2.3.4
編譯:
tsc helloworld.ts
四.基礎(chǔ)類型
1.Boolean
let isDone: boolean = false;
2.number
typescript 還支持es6里面引入的二進(jìn)制和八進(jìn)制的字面量
let decLiteral: number = 6;
let hexLiteral: number = 0xf00d;
let binaryLiteral: number = 0b1010;
let octalLiteral: number = 0o744;
3.string
let name: string = "bob";
name = "smith";
在這里還可以使用模板字符串利用反引號 (`),包圍昆淡，并且用 ${expr}這種形式嵌入表達(dá)式。
let name: string = `Gene`;
let age: number = 37;
let sentence: string = `Hello, my name is ${ name }.
I'll be ${ age + 1 } years old next month.`;
4.Array
TypeScript定義數(shù)組有兩種方式:
1 .在元素類型后面接上 `[]`
let list: number[] = [1, 2, 3];
2 .使用泛型
let list: Array<number> = [1, 2, 3];
5.Tuple
元組類型允許表示一個已知元素數(shù)量和類型的數(shù)組刽严，各元素的類型不必相同昂灵。 比如，你可以定義一對值分別為 string和number類型的元組舞萄。
// Declare a tuple type
let x: [string, number];
// Initialize it
x = ['hello', 10]; // OK
// Initialize it incorrectly
x = [10, 'hello']; // Error
6.枚舉enum
enum類型是對JavaScript標(biāo)準(zhǔn)數(shù)據(jù)類型的一個補(bǔ)充眨补。 像C#等其它語言一樣，使用枚舉類型可以為一組數(shù)值賦予友好的名字倒脓。
enum Color {Red, Green, Blue}
let c: Color = Color.Green;
7.Any
any 是默認(rèn)的類型撑螺，其類型的變量允許任何類型的值：
let notSure:any = 10;
let notSure2:any[] = [1,"2",false];
8.void
JavaScript 沒有空值 Void 的概念，在 TypeScirpt 中崎弃，可以用 void 表示沒有任何返回值的函數(shù)：
function alertName(): void {
console.log('My name is muyy')
}
9.Null 和 Undefined
TypeScript里甘晤，undefined和null兩者各自有自己的類型分別叫做undefined和null。 和 void相似饲做，它們的本身的類型用處不是很大：
let u: undefined = undefined;
let n: null = null;
10.Never
never類型表示的是那些永不存在的值的類型
never類型是任何類型的子類型线婚，也可以賦值給任何類型；然而艇炎，沒有類型是never的子類型或可以賦值給never類型（除了never本身之外）酌伊。 即使 any也不可以賦值給never。
// 返回never的函數(shù)必須存在無法達(dá)到的終點(diǎn)
function error(message: string): never {
throw new Error(message);
}
// 返回never的函數(shù)必須存在無法達(dá)到的終點(diǎn)
function infiniteLoop(): never {
while (true) {
}
}
類型斷言
類型斷言有兩種形式缀踪。 其一是“尖括號”語法：
let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;
另一個為as語法：
let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;
兩種形式是等價的居砖。 至于使用哪個大多數(shù)情況下是憑個人喜好；然而驴娃，當(dāng)你在TypeScript里使用JSX時奏候，只有 as語法斷言是被允許的。
函數(shù)：
function add(x: string, y: string): string{
return "Hello TypeScript";
}
let add2 = function(x: string, y: string): string{
return "Hello TypeScript";
}
類：
概括在TypeScript中class的核心語義：所有的class都是一個立即函數(shù)唇敞，所有的數(shù)據(jù)成員都是這個函數(shù)實(shí)例的屬性蔗草，所有的方法都是這個函數(shù)原型的屬性咒彤，所有的靜態(tài)成員都是這個函數(shù)的構(gòu)造函數(shù)的屬性
class Person{
name:string; // 這個是對后文this.name類型的定義
age:number;
constructor(name:string,age:number){
this.name = name;
this.age = age;
}
fo(){
return this.name + this.age;
}
}
let person:Person = new Person('text',23)
console.log(person.fo()) // text23
接口:
TypeScript里，接口的作用就是為這些類型命名和為你的代碼或第三方代碼定義契約咒精。
interface Shape{
color: string;
}
interface PenStroke{
penWidth: number;
}
interface Square extends Shape,PenStroke{
sideLength: number;
}
let s = <Square>{};
s.color = "blue";
s.penWidth = 100;
s.sideLength = 10;
五.tsconfig.json
作用:
- 用于標(biāo)識 TypeScript 項(xiàng)目的根路徑
- 用于配置 TypeScript 編譯器
- 用于指定編譯的文件
示例：
{
"files": ["src/app/app.ts"],
"compilerOptions": {
"target": "es5",
"removeComments": true,
"alwaysStrict": true, //代碼將在嚴(yán)格模式下執(zhí)行
"noEmitOnError": true,//表示當(dāng)發(fā)生錯誤的時候镶柱，編譯器不要生成 JavaScript 代碼
"noUnusedLocals": true,
"noUnusedParameters": true//表示編譯器將檢測沒有使用的變量或參數(shù)
}
}
六.總結(jié)
1.關(guān)于typescript簡介
2.使用它的理由
3.搭建TypScipt開發(fā)環(huán)境
4.基本數(shù)據(jù)類型
5.tsconfig.json
