TypeScript的初識

TypeScript 是什么

TypeScript (簡稱:TS )是 JavaScript 的超集 ( JS 有的 TS 都有)。TypeScript = Type + JavaScript (在 JS 基礎(chǔ)之上,為 JS 添加了類型支持)。 TypeScript 是微軟開發(fā)的開源編程語言,可以在任何運行 JavaScript 的地方運行。

在JS的基礎(chǔ)下為什么要用ts

  1. js最開始是為了在前端做數(shù)據(jù)效驗,本身是有缺陷的----變量沒有類型
  2. 在大型項目中瓶埋,js在出錯之后,不好定位出錯的代碼诊沪,在執(zhí)行階段才能發(fā)現(xiàn)
    3.ts需要添加類型养筒,在代碼編譯的時候ts(代碼執(zhí)行前)就可以發(fā)現(xiàn)錯誤 。
  3. ts屬于靜態(tài)類型的編程語言端姚, JS 屬于動態(tài)類型的編程語言晕粪。
    靜態(tài)類型:編譯期做類型檢查; 動態(tài)類型:執(zhí)行期做類型檢查渐裸。
    代碼編譯和代碼執(zhí)行的順序: 先編譯 后執(zhí)行巫湘。

TS的特點

  1. 給變量和函數(shù)參數(shù)定義數(shù)據(jù)類型
  2. ts需要編譯装悲,在編譯階段(cnpm i typescript -g )就可以發(fā)現(xiàn)數(shù)據(jù)類型錯誤,從根源上解決數(shù)據(jù)類型導(dǎo)致的一些bug
  3. 新增了一些特殊類型:元祖 泛型 聯(lián)合類型 字符串常量 構(gòu)造類修飾器--public(公共成員)剩膘、private(私有成員)衅斩、protected(保護(hù)成員)
  4. 只要是js可以執(zhí)行的平臺(瀏覽器盆顾,node)怠褐,ts都可以使用
  5. ts不能直接使用,需要編譯成js之后再去調(diào)用
  6. 可以給ts添加配置選項您宪,指定比如需要編譯的ts文件/目錄奈懒,以及轉(zhuǎn)成的js版本,模塊化的標(biāo)準(zhǔn)(commonJS/ES6)
  7. 程序中任何位置的代碼都有代碼提示 宪巨,隨時隨地的安全感磷杏,增強(qiáng)了開發(fā)體驗。
  8. 強(qiáng)大的類型系統(tǒng)提升了代碼的可維護(hù)性捏卓,使得重構(gòu)代碼更加容易极祸。
  9. TS 類型推斷機(jī)制, 不需要在代碼中的每個地方都顯示標(biāo)注類型 怠晴,讓你在享受優(yōu)勢的同時遥金,盡量降低了成本。

怎么使用TS

  1. 創(chuàng)建一個.ts文件



    2.全局安裝ts(在終端編輯cnpm i typescript -g )


為什么要安裝編譯 TS 的工具包蒜田?

Node.js/瀏覽器稿械,只認(rèn)識 JS 代碼,不認(rèn)識 TS 代碼冲粤。需要先將 TS 代碼轉(zhuǎn)化為 JS 代碼美莫, 然后才能運行。

3.如果不知道有沒有安裝成功可以查看一下版本


  1. 開始編譯



    隨后就會自動生成一個.js文件

  1. 在.ts里開始寫代碼梯捕,并且編譯厢呵,.js文件隨后也會同步(報錯可以不必理會,問題不大傀顾,不會影響運行)



  2. 在.ts里給變量添加類型注解



    開始運行



    出現(xiàn)上圖錯誤表明編譯錯了文件襟铭,應(yīng)該編譯.js文件
  3. 全局監(jiān)聽
    初始化



    自動生成(也可以自己手動添加)



    打開文件,只留下編譯選項

    編譯一下(會發(fā)現(xiàn)不會再報錯了)

    然后進(jìn)行全局監(jiān)聽




    出現(xiàn)上圖情況表明已經(jīng)監(jiān)聽成功

為什么要進(jìn)行監(jiān)聽

每次修改代碼后 锣笨,都要重復(fù)執(zhí)行兩個命令 蝌矛,才能運行 TS 代碼, 太繁瑣错英,于是就進(jìn)行監(jiān)聽 入撒,監(jiān)聽當(dāng)前目錄下的ts文件改變,并且如果沒有發(fā)現(xiàn)錯誤椭岩,就可以運行 JS 代碼茅逮。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末璃赡,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子献雅,更是在濱河造成了極大的恐慌碉考,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,681評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件挺身,死亡現(xiàn)場離奇詭異侯谁,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)章钾,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,205評論 3 399
  • 文/潘曉璐 我一進(jìn)店門墙贱,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人贱傀,你說我怎么就攤上這事惨撇。” “怎么了府寒?”我有些...
    開封第一講書人閱讀 169,421評論 0 362
  • 文/不壞的土叔 我叫張陵魁衙,是天一觀的道長。 經(jīng)常有香客問我株搔,道長剖淀,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 60,114評論 1 300
  • 正文 為了忘掉前任邪狞,我火速辦了婚禮祷蝌,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘帆卓。我一直安慰自己巨朦,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 69,116評論 6 398
  • 文/花漫 我一把揭開白布剑令。 她就那樣靜靜地躺著糊啡,像睡著了一般。 火紅的嫁衣襯著肌膚如雪吁津。 梳的紋絲不亂的頭發(fā)上棚蓄,一...
    開封第一講書人閱讀 52,713評論 1 312
  • 那天,我揣著相機(jī)與錄音碍脏,去河邊找鬼梭依。 笑死,一個胖子當(dāng)著我的面吹牛典尾,可吹牛的內(nèi)容都是我干的役拴。 我是一名探鬼主播,決...
    沈念sama閱讀 41,170評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼钾埂,長吁一口氣:“原來是場噩夢啊……” “哼河闰!你這毒婦竟也來了科平?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 40,116評論 0 277
  • 序言:老撾萬榮一對情侶失蹤姜性,失蹤者是張志新(化名)和其女友劉穎瞪慧,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體部念,經(jīng)...
    沈念sama閱讀 46,651評論 1 320
  • 正文 獨居荒郊野嶺守林人離奇死亡弃酌,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,714評論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了印机。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片矢腻。...
    茶點故事閱讀 40,865評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡门驾,死狀恐怖射赛,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情奶是,我是刑警寧澤楣责,帶...
    沈念sama閱讀 36,527評論 5 351
  • 正文 年R本政府宣布,位于F島的核電站聂沙,受9級特大地震影響秆麸,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜及汉,卻給世界環(huán)境...
    茶點故事閱讀 42,211評論 3 336
  • 文/蒙蒙 一沮趣、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧坷随,春花似錦房铭、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,699評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至类溢,卻和暖如春凌蔬,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背闯冷。 一陣腳步聲響...
    開封第一講書人閱讀 33,814評論 1 274
  • 我被黑心中介騙來泰國打工砂心, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人蛇耀。 一個月前我還...
    沈念sama閱讀 49,299評論 3 379
  • 正文 我出身青樓辩诞,卻偏偏與公主長得像,于是被迫代替她去往敵國和親蒂窒。 傳聞我的和親對象是個殘疾皇子躁倒,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,870評論 2 361

推薦閱讀更多精彩內(nèi)容