JavaScript是程序員可以在前端和后端使用的最常見(jiàn)的語(yǔ)言。但是，不清楚數(shù)據(jù)在純JavaScript中的類(lèi)型是什么，因?yàn)楹瘮?shù)，參數(shù)和變量沒(méi)有類(lèi)型。這使得讀取和維護(hù)項(xiàng)目變得困難。

　　如果您正在使用 JavaScript 開(kāi)發(fā)一個(gè)項(xiàng)目，并且遇到此類(lèi)問(wèn)題，則類(lèi)型腳本是解決這些問(wèn)題的最合適語(yǔ)言。

　　類(lèi)型腳本是添加靜態(tài)類(lèi)型的 JavaScript 的語(yǔ)法超集。這意味著您可以在使用類(lèi)型腳本時(shí)向數(shù)據(jù)添加類(lèi)型，實(shí)際上，這只不過(guò)是用JavaScript編寫(xiě)代碼。

　　在本文中，我將介紹如何使用類(lèi)型腳本而不是 JavaScript 開(kāi)發(fā)一個(gè)簡(jiǎn)單的網(wǎng)站。

　　我將使用 VS 代碼作為 IDE。

　　讓我們從創(chuàng)建基本文件開(kāi)始。

　　如您所知，基本上是一個(gè)簡(jiǎn)單的項(xiàng)目外觀。但我想用主.ts更改文件.js因?yàn)轭?lèi)型腳本文件的擴(kuò)展名“.ts”。我在 main.ts 中創(chuàng)建了一個(gè)簡(jiǎn)單的函數(shù)。

　　我將類(lèi)型腳本文件添加到文件索引中.html就像一個(gè) JavaScript 文件。我用文件索引中的按鈕調(diào)用該函數(shù).html。

　　結(jié)果是：

　　它給出了兩個(gè)錯(cuò)誤。第一個(gè)原因是因?yàn)楹瘮?shù)具有類(lèi)型(此處為 void)。第二個(gè)源于第一個(gè)。由于 main.ts 文件中的函數(shù)具有類(lèi)型，因此在 HTML 文件中是未知的。

　　為了解決這個(gè)問(wèn)題，我們必須安裝Node.js(如果不可用)，然后安裝typescript包。您可以按照此鏈接安裝 Node.js。您可以通過(guò)在終端中鍵入以下命令來(lái)安裝typescript包。

　　npm install typescript

　　安裝軟件包后，我在終端中鍵入以下命令：

　　tsc script/main.ts

　　通過(guò)此命令，您將在文件夾腳本中看到一個(gè)新的主.js文件。生成的文件是由類(lèi)型腳本轉(zhuǎn)譯器生成的等效的 JavaScript 文件。

　　現(xiàn)在在索引.html文件中，我調(diào)用生成的主.js文件，而不是main.ts文件。

　　但是在編譯之后，您可能會(huì)收到此錯(cuò)誤：“無(wú)法重新聲明塊范圍的變量'myFunction'。

　　為了解決這個(gè)問(wèn)題，我將代碼“export{}”添加到 main.ts 的最后一行。它應(yīng)該如下所示：

　　const myFunction = (): void => {return console.log(“Hello World!”);};export {};

　　結(jié)果是：

　　賓果游戲

　　請(qǐng)記住，在 main.ts 文件進(jìn)行每次更改后，我們必須運(yùn)行以下代碼：

　　tsc script/main.ts