2024-06-06|閱讀時間 ‧ 約 25 分鐘

Typescript入門-Day2:語法、註解、變數

語法

一般結構

TypeScript的基本結構類似於JavaScript,但引入了類型註解等特性。以下是一個簡單的TypeScript程序的結構:

// Import 模塊
import { someFunction } from './someModule';

// 類型註解
let message: string = "Hello, TypeScript";

// 函數
function greet(name: string): string {
return `Hello, ${name}`;
}

// 類
class Greeter {
greeting: string;

constructor(message: string) {
this.greeting = message;
}

greet(): string {
return `Hello, ${this.greeting}`;
}
}

// 創建實例
let greeter = new Greeter(message);

console.log(greeter.greet());

程式進入點

TypeScript程序的進入點與JavaScript一樣,是通過一個入口文件來啟動的。在Node.js環境中,通常是index.tsapp.ts

// index.ts
import { Server } from './server';

const server = new Server();
server.start();

在前端應用中,入口文件通常由構建工具(如Webpack)配置:

// src/main.ts
import { App } from './app';

const app = new App();
app.initialize();

註解

單行註解

單行註解使用//符號,與JavaScript完全相同:

// 這是一個單行註解
let singleLineComment: string = "This is a single line comment";

多行註解

多行註解使用/* */符號,與JavaScript一致:

/*
這是一個多行註解
可以跨越多行
*/
let multiLineComment: string = "This is a multi-line comment";

變數

單個變數

TypeScript中變數的定義與JavaScript類似,但可以加上類型註解:

let name: string = "John";
let age: number = 30;
let isStudent: boolean = true;

可以使用letconstvar來定義變數,但建議使用letconst

const pi: number = 3.14; // 常量
let count: number = 10; // 可變變數

多個變數賦值

在TypeScript中可以通過解構賦值來同時給多個變數賦值:

// 數組解構
let [first, second]: [number, number] = [1, 2];

// 對象解構
let person = {
name: "Alice",
age: 25
};

let { name, age }: { name: string; age: number } = person;

以上內容涵蓋了TypeScript語法中的一般結構、程式進入點、註解和變數賦值的基本知識。這些知識將幫助你開始使用TypeScript進行開發。

分享至
成為作者繼續創作的動力吧!
© 2024 vocus All rights reserved.