Tóm tắt Kiến thức Cơ bản về TypeScript cho Người Mới Bắt Đầu

1. Giới thiệu về TypeScript

TypeScript là một ngôn ngữ lập trình mã nguồn mở được phát triển bởi Microsoft. Nó là một tập hợp mở rộng của JavaScript, cung cấp thêm các tính năng như kiểu tĩnh, lớp, và module.

2. Cài đặt TypeScript

• Node.js và npm: Đầu tiên, cài đặt Node.js và npm (Node Package Manager) nếu bạn chưa có.

Cài đặt TypeScript: Sử dụng lệnh sau để cài đặt TypeScript qua npm:

npm install -g typescript

Kiểm tra phiên bản: Kiểm tra xem bạn đã cài đặt TypeScript thành công chưa:

tsc --version

3. Kiểu Dữ Liệu (Types)

TypeScript thêm kiểu tĩnh vào JavaScript. Dưới đây là một số kiểu dữ liệu cơ bản:

• Number: let num: number = 5;
• String: let str: string = “Hello”;
• Boolean: let isTrue: boolean = true;
• Array: let numArray: number[] = [1, 2, 3];
• Tuple: let tuple: [string, number] = [“Hello”, 5];
• Enum: enum Color {Red, Green, Blue}; let c: Color = Color.Green;
• Any: let anything: any = 5; anything = “Hello”;

4. Khai báo Biến

Biến cục bộ: let và const tương tự như trong ES6.

let age: number = 25;
const pi: number = 3.14;

5. Hàm (Functions)

TypeScript cho phép bạn định nghĩa kiểu cho tham số và kiểu trả về của hàm:

function add(x: number, y: number): number {
  return x + y;
}

Tham số tùy chọn và mặc định:

function greet(name: string, greeting: string = "Hello"): string {
  return `${greeting}, ${name}!`;
}

6. Giao diện (Interfaces)

Giao diện định nghĩa cấu trúc của một đối tượng:

interface Person {

  firstName: string;

  lastName: string;

  age?: number; // Optional

}

let user: Person = {

  firstName: "John",

  lastName: "Doe"

};

7. Lớp (Classes)

TypeScript hỗ trợ lập trình hướng đối tượng với các lớp:

class Animal {

  name: string;

  constructor(name: string) {

    this.name = name;

  }

  move(distance: number = 0) {

    console.log(`${this.name} moved ${distance} meters.`);

  }

}

let cat = new Animal("Cat");

cat.move(10);

Kế thừa:
typescript
Copy code

class Dog extends Animal {
bark() {
    console.log("Woof! Woof!");
  }

}

let dog = new Dog("Dog");

dog.bark();

dog.move(5);

8. Modules

TypeScript sử dụng các module để tổ chức mã nguồn:

Export – Xuất:

export class Car {

  // ...

}

Import – Nhập:

import { Car } from './CarModule';

9. Biên dịch TypeScript

Để biên dịch tệp .ts sang .js, sử dụng lệnh:

tsc filename.ts

Tạo tệp cấu hình tsconfig.json để cấu hình dự án TypeScript:

tsc -- init

tsconfig.json

{

  "compilerOptions": {

    "target": "es5",

    "module": "commonjs",

    "strict": true

  }

}

Kết luận

TypeScript mở rộng JavaScript với các tính năng mạnh mẽ như kiểu tĩnh, lớp, và module, giúp mã nguồn trở nên rõ ràng và dễ bảo trì hơn. Bắt đầu với các khái niệm cơ bản này sẽ giúp bạn nhanh chóng làm quen và sử dụng TypeScript hiệu quả.