“學(xué)習(xí)TypeScript難嗎持痰？”铸本，對于新手而言嗽桩，在剛接觸到一門新技術(shù)的時候嗅骄，總是很習(xí)慣的問上這么一句床绪。在這里我可以鄭重的告訴你：“上手TypeScript幾乎沒有任何難度可言机杜！”
TypeScript最近很火帜讲，有很多開源的項目也是由其開發(fā)的，如果你是一名前端開發(fā)工程師或準(zhǔn)備要成為一名前端開發(fā)工程師的話椒拗，現(xiàn)在如果再不學(xué)習(xí)TypeScript就真的太OUT了舒帮！那么現(xiàn)在請你系好安全帶，和我一起踏上學(xué)習(xí)TypeScript之旅吧陡叠！
一玩郊、TypeScript是什么？
相親也要先了解一下枉阵，更何況是學(xué)習(xí)一門新的知識译红，對吧。
1兴溜、TypeScript 是微軟在2012年開發(fā)的一門免費開源的編程語言侦厚。它是 JavaScript 的一個超集（增強版）。它在JS原來的基礎(chǔ)上增加了一套十分強大的類型系統(tǒng)拙徽，從而可以讓小伙伴們在寫代碼的時候獲得更加豐富的語法提示刨沦。在代碼的編譯階段也可以通過類型系統(tǒng)的檢查，從而有效避免一些線上錯誤膘怕。
2想诅、TypeScript是一門比Java更Script的編程語言。也就是說TypeScript具有真正的面向?qū)ο缶幊趟枷耄憧梢圆捎盟鼇硗瓿筛哟笮蛷?fù)雜的應(yīng)用来破。
3篮灼、TypeScript始于JavaScript終于JavaScript。也就是說TypeScript遵循JavaScript的語法和語義徘禁，任何Js都可以在Ts內(nèi)運行诅诱，但TypeScript它不可以直接在瀏覽器中運行，必須要將其轉(zhuǎn)換為JavaScript送朱。
簡單的說：你可以用TypeScript來編寫出更加出色的JavaScript代碼娘荡，用來搞定規(guī)模可觀的JavaScript項目驶沼！
二它改、為什么要學(xué)習(xí)TypeScript?
1 、擁有強大的靠山商乎，分別為微軟與谷歌央拖。TypeScript是由微軟開發(fā)的，谷歌的Angular框架是用Typescript開發(fā)的鹉戚。所以TypeScript很有可能是未來的前端腳本語言發(fā)展的主流方向鲜戒。
2、Vue 3.0 源碼全部用typescript重寫抹凳。Vue.Js在前兩年發(fā)展迅速遏餐，用戶數(shù)和粉絲量呈指數(shù)級增長，目前Vue開發(fā)者插件用戶數(shù)約為70.4萬赢底。
3失都、Node.js之父瑞安達(dá)爾（Ryan Dahl）發(fā)布了新的開源項目 deno，而該項目最終是要提供一個安全的 TypeScript 運行環(huán)境幸冻。
4粹庞、為了升職加薪！
三洽损、如何學(xué)好TypeScript
1庞溜、擁有JavaScript基礎(chǔ)，了解Es6（不解釋）
2碑定、打開你的開發(fā)工具流码，一定要做到邊學(xué)邊練習(xí)。學(xué)習(xí)編程沒有捷徑可言延刘，唯一的突破口便是多敲打你的代碼漫试。
3、將TypeScript應(yīng)用到一個較為復(fù)雜的場景中碘赖。學(xué)以致用驾荣，學(xué)編程也是需要悟的外构，只有將TypeScript真正應(yīng)用起來，你才能夠領(lǐng)悟到TypeScript帶給你的震撼秘车。
四典勇、TypeScript相關(guān)
官網(wǎng)：https://www.typescriptlang.org
中文：http://www.tslang.cn
官方博客：https://blogs.msdn.microsoft.com/typescript
五劫哼、環(huán)境搭建
因為TypeScript在JavaScript的基礎(chǔ)上增加了類型系統(tǒng)叮趴，所以TypeScript不能夠直接在瀏覽器當(dāng)中運行。我們需要使用編譯器將TypeScript編譯為JavaScript权烧。
先來搭建一個TypeScript的基本開發(fā)環(huán)境：
1眯亦、安裝Node.js
因為TypeScript編譯為JavaScript需要Node環(huán)境的支持，所以需要先進(jìn)行Node的安裝般码。Node的安裝很簡單妻率，首先打開https://nodejs.org/zh-cn/，下載Node安裝包板祝，然后傻瓜式安裝宫静。安裝完成以后打開命令工具輸入：
node -v
npm -v
如果你可以看到node以及npm那就說明你已經(jīng)成功安裝好了Node.js
2、全局安裝TypeScript
在命令窗口中繼續(xù)輸入命令：
npm install typescript -g
查看TypeScript版本：
tsc --version
3券时、運行你的第一個TS程序
- 創(chuàng)建一個zhangpeiyue.ts文件
- 在文件內(nèi)寫入：
var site:string = "zhangpeiyue.com";// string 為設(shè)置變量類型
console.log(site);
- 在命令窗口輸入以入命令孤里，將ts編譯為js：
tsc zhangpeiyue.ts
- 在文件夾內(nèi)多出一個名字為zhangpeiyue.js的文件：
var site = "zhangpeiyue.com";
console.log(site);
- node運行
node zhangpeiyue.js
4、實現(xiàn)對ts文件監(jiān)聽
- 通過命令橘洞，創(chuàng)建package.json
npm init -y
- 打開package.json捌袜，增加腳本build執(zhí)行tsc命令：
"scripts": {
"build":"tsc"
}
- tsc命令會使用到tsconfig.json的配置，新建tsconfig.json炸枣，輸入以下代碼：
{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"sourceMap": true,
"outDir": "lib"
},
"include":[
"src/**/*.ts"
]
}
以上配置會將src目錄下的ts編譯到lib文件夾下虏等。outDir設(shè)置輸出目錄。
- 將zhangpeiyue.ts移入到src目錄适肠， 輸入命令：
cnpm run build
你會發(fā)現(xiàn)lib文件夾多了一個zhangpeiyue.js文件霍衫。
- 如果要實現(xiàn)代碼自動監(jiān)聽，可在package.json中增加start腳本：
"scripts": {
"start":"tsc --watch",
"build":"tsc",
},
這樣在你修改完代碼保存后就自動將你的ts文件編譯到j(luò)s當(dāng)中侯养。
