TypeScript 基礎介紹

TypeScript 簡介

TypeScript 是一種由微軟開發的開源語言，它在 JavaScript 的基礎上增加了靜態類型定義（Static Typing）。TypeScript 的設計目的是為了開發大型應用，並且轉譯成 JavaScript。它提供了類型檢查（Type Checking）功能，可以在代碼運行之前發現錯誤，從而提高代碼的質量和可維護性。TypeScript 是 JavaScript 的超集（Superset），意味著任何有效的 JavaScript 代碼都是有效的 TypeScript 代碼。

安裝與環境設置

安裝 TypeScript 首先需要安裝 Node.js，因為 TypeScript 是作為一個 npm（Node Package Manager）包來安裝的。安裝 Node.js 後，使用以下命令安裝 TypeScript：

npm install -g typescript

檢查安裝是否成功：

tsc --version

環境設置主要涉及編輯器的配置，常用的編輯器如 Visual Studio Code，對 TypeScript 支持良好。

TypeScript 基本語法

Variables

TypeScript 讓你可以顯式地指定變量的類型：

let isDone: boolean = false;
let age: number = 42;
let name: string = "Hello World";

Data Types

TypeScript 提供了 JavaScript 中沒有的一些數據類型，如：元組（Tuples）、枚舉（Enums）和任意值（Any）。

Interfaces

接口是 TypeScript 的重要組成部分，用於定義對象的形狀，即定義對象中哪些屬性存在及其類型：

interface User {
    name: string;
    age: number;
}

Functions and Classes

Functions

TypeScript 允許為函數的參數和返回值指定類型：

function greet(name: string): string {
    return "Hello, " + name;
}

Classes

TypeScript 支持基於類的面向對象編程（OOP）：

class Animal {
    name: string;
    constructor(theName: string) { this.name = theName; }
    move(distanceInMeters: number = 0) {
        console.log(`${this.name} moved ${distanceInMeters}m.`);
    }
}

Inheritance and Access Modifiers

TypeScript 支持繼承，並且可以使用像 public、private 這樣的存取修飾符來限制成員的可訪問性。

基礎類型操作

Arrays

在 TypeScript 中，陣列可以有兩種表示方式：

let list: number[] = [1, 2, 3];
let list: Array<number> = [1, 2, 3];

Tuples

元組允許你表示一個已知元素數量和類型的陣列，各元素的類型不必相同：

let x: [string, number];
x = ["hello", 10];

Enums

枚舉是 TypeScript 新增的一種數據類型，它用於定義命名常數集合：

enum Color {Red, Green, Blue}
let c: Color = Color.Green;