關於 TypeScript 中的類型，您需要了解的一切

打字稿：JavaScript中的靜態鍵入初學者指南

JavaScript的靈活性是一把雙刃劍。儘管它允許快速原型和易用性，但其動態性質可能會導致難以刪除的運行時錯誤。 TypeScript是JavaScript的超集，通過添加靜態鍵入來解決此問題。本指南介紹了打字稿的類型系統，解釋了其好處以及如何有效使用它。

理解類型

在編程中，A

> type

指定變量可以保存的數據的種類。 JavaScript的動態鍵入意味著變量可以自由更改類型：>

這種靈活性雖然方便，但可能會引起意外的問題。打字稿的靜態鍵入要求您聲明變量的類型，以防止此類錯誤：>

<code class="language-javascript">let value = 42; // Number
value = "Hello"; // String</code>

類型的重要性

<code class="language-typescript">let value: number = 42;
value = "Hello"; // Error: Type 'string' is not assignable to type 'number'</code>

>

早期錯誤檢測：

在編譯期間捕獲錯誤，而不是運行時。

• >增強的工具：受益於改進的自動完成和重構的IDE。
>
• 改進的代碼可讀性：類型用作內置文檔。
• >可伸縮性：更有效地管理較大的項目。
>
• >基本打字稿類型
>讓我們探索核心打字稿類型：

數字：

代表數字值：

1. 字符串：

   <code class="language-typescript">let age: number = 25;
   let pi: number = 3.14;</code>

   用於文本：

2. >布爾值：

   <code class="language-typescript">let name: string = "Alice";
   let message: string = `Hello, ${name}`;</code>

   true/false值：

3. 數組：

   項目集合：>

   <code class="language-typescript">let isActive: boolean = true;</code>

或使用仿製藥：

4. <code class="language-typescript">let numbers: number[] = [1, 2, 3];
   let names: string[] = ["Alice", "Bob"];</code>

   元組：

   一個具有固定長度和類型的數組：

   <code class="language-typescript">let values: Array<number> = [10, 20, 30];</code>

5. >

   <code class="language-typescript">let tuple: [string, number] = ["Alice", 25];</code>

any：
6. 通配符類型（少見！）：

   <code class="language-typescript">enum Direction {
     Up,
     Down,
     Left,
     Right
   }
   let move: Direction = Direction.Up;</code>

void：
7. 對於沒有返回值的函數：

   >

   明確表示null或Undefined：

   <code class="language-typescript">let random: any = 42;
   random = "Hello";</code>

8. >從不：>一種從未發生過的類型（例如，始終會引發錯誤的函數）：

   <code class="language-typescript">function logMessage(message: string): void {
     console.log(message);
   }</code>

9. 高級打字稿類型 Typescript為複雜方案提供更多高級類型：

   • 聯合型別：允許一個變數保存多種型別：let id: number | string;
   • 交叉點類型： 組合多種類型：type Staff = Person & Employee;
   • 型別別名： 建立自訂型別名稱：type Point = { x: number; y: number; };
   • 介面： 定義物件形狀：interface User { id: number; name: string; }
   • 文字類型： 將變數限制為特定值：let direction: "up" | "down";
   • 型別斷言： 明確指定型別：let input = <HTMLInputElement>document.getElementById("input");

   初學者實用技巧

   • 先使用 tsc --init 將 TypeScript 新增至現有 JavaScript 專案。
   • 使用 strict 編譯器選項以獲得最佳實務。
   • 逐漸將型別引入您的程式碼庫。
   • 利用 VS Code 等優秀的 IDE 來支援 TypeScript。
   • 避免過度使用any。

   結論

   TypeScript 的類型系統顯著提高了程式碼品質和可維護性。透過掌握類型，您將編寫更健壯且可擴展的應用程式。 擁抱靜態類型的力量並增強您的開發工作流程！

以上是關於 TypeScript 中的類型，您需要了解的一切的詳細內容。更多資訊請關注PHP中文網其他相關文章！