我畫了5張腦圖可以讓你快速入門TypeScript

語言: CN / TW / HK

theme: fancy highlight: atom-one-light


持續創作,加速成長!這是我參與「掘金日新計劃 · 6 月更文挑戰」的第17天,點選檢視活動詳情

Hi~,我是一碗周,如果寫的文章有幸可以得到你的青睞,萬分有幸~

🍏 寫在前面

TypeScript已經變成了前端工程師的必備技能,而且TypeScript的使用可以時漸進式的;為什麼這麼說呢?因為TypeScript時完全向下相容JavaScript的,就算是你一行TS的程式碼都不會寫,只要知道any就可以使用TS進行開發,這就是AnyScript的由來,但是如果這樣寫就完全失去了引入TS的目的。

TypeScript可以說是一種新的程式語言,所以說學習TS也是需要一定時間了,為了幫助快速學習,這裡我整理了5張腦圖,可以幫助我們快速上手。

🍑 型別

TypeScript解決了JavaScript中的一個最大問題,就是JavaScript中的變數沒有型別,TS中的型別在JavaScript的基礎上補充了列舉型別和元組型別,還存在型別保護、型別斷言和型別提示等功能,腦圖如下:

01_型別.png

🍒 函式

函式幾乎是所有程式語言中最重要的部分,TypeScript為JavaScript函式添加了額外的功能,讓我們可以更容易地使用。

02_函式.png

🍓 介面

介面是TypeScript中的重要特性之一,為值所具有的結構進行型別檢查,介面可以幫助我們為型別進行命名以及對程式碼進行約束。

03_介面.png

🫐 類

在ES6中也提出了類的概念,TS中的在ES6的基礎上又進行了擴充套件。

04_類.png

🍈 泛型

泛型的出現我們讓我們來建立可重用的函式、類或者元件,我們可以為其傳遞多種型別,這樣就可以以各種資料型別來使用該函式、類或者元件。

05_泛型.png

🥭 寫在最後

本篇文章到這裡就結束了,可以利用文中的腦圖快速的入門TypeScript,但是也僅僅是入門,如果想要更加深入的瞭解TS還需要繼續學習