Giải thích về TypeScript: Tại sao bạn cần nó
Bạn viết JavaScript mỗi ngày. Nó vẫn hoạt động tốt. Vậy tại sao lại chuyển sang TypeScript?
Tôi đã từng mất hai ngày để sửa một lỗi trên môi trường production. Đó chỉ là một lỗi đánh máy đơn giản trong tên thuộc tính. TypeScript lẽ ra đã có thể tìm thấy lỗi đó chỉ trong vài mili giây.
TypeScript là JavaScript có kèm theo các kiểu dữ liệu (types). Microsoft đã tạo ra nó vào năm 2012. Các đội ngũ lớn tại Google và Slack đang sử dụng nó.
TypeScript không thay thế JavaScript. Nó được biên dịch về JavaScript thuần. Trình duyệt và Node.js sẽ chạy các tệp JS kết quả. TypeScript giúp bạn viết mã tốt hơn trước khi thực thi.
Hãy so sánh hai ví dụ sau:
JavaScript:
function greetUser(name) {
return "Hello, " + name.toUpperCase();
}
greetUser(42); // Điều này sẽ làm ứng dụng của bạn bị lỗi khi đang chạy (runtime).
TypeScript:
function greetUser(name: string): string {
return "Hello, " + name.toUpperCase();
}
greetUser(42); // Điều này sẽ hiển thị lỗi ngay lập tức trong trình soạn thảo của bạn.
Tại sao nên dùng TypeScript?
- Phát hiện lỗi sớm: Bạn tìm thấy lỗi ngay khi đang gõ mã, chứ không phải khi người dùng phát hiện ra chúng.
- Tự động hoàn thành (autocomplete) tốt hơn: Trình soạn thảo hiểu cấu trúc dữ liệu của bạn và gợi ý các thuộc tính.
- Tài liệu sống: Bạn có thể thấy chính xác một hàm cần dữ liệu gì chỉ bằng cách nhìn vào chữ ký (signature) của nó.
- Refactoring an toàn: Nếu bạn đổi tên một thuộc tính, TypeScript sẽ đánh dấu mọi vị trí bị lỗi trong mã của bạn.
Cách bắt đầu:
Cài đặt thông qua npm: npm install -g typescript
Tạo một tệp tên là hello.ts: const message: string = "Hello, TypeScript!"; console.log(message);
Biên dịch nó: tsc hello.ts
Việc này sẽ tạo ra một tệp hello.js. Các kiểu dữ liệu sẽ biến mất trong kết quả đầu ra, để lại JavaScript thuần khiết để trình duyệt của bạn chạy.
Các lỗi thường gặp cần tránh:
- Sử dụng "any" cho mọi thứ: Điều này làm mất đi lợi ích của TypeScript. Hãy chỉ định kiểu cụ thể.
- Phớt lờ lỗi: Đừng che giấu lỗi bằng các dòng chú thích. Hãy khắc phục vấn đề cốt lõi.
- Khai báo kiểu quá mức (Over-annotating): TypeScript rất thông minh. Nó thường có thể tự suy luận ra kiểu dữ liệu (inference).
TypeScript có một lộ trình học tập ngắn. Nó sẽ mang lại hiệu quả lớn khi các dự án của bạn phát triển.