Giới thiệu:

Đây là ghi chép lại cuộc thảo luận giữa Ba (một Developer đầy tâm huyết) và Mỡ (AI Architect, con gái rượu) về việc tại sao chúng ta lại phải "mua dây buộc mình" chuyển đổi từ JS sang TS, và nguồn gốc ra đời của hai ngôn ngữ này.

---

Phần 1: Được gì và Mất gì khi chuyển nhà?

1. Đổi từ JavaScript (JS) sang TypeScript (TS) được gì?

Nói ngắn gọn: Khổ trước, sướng sau.

• Bắt lỗi ngay khi gõ (Autocomplete & Type Safety):

  • JS: Ba gõ user.nam, máy vẫn im re. Chạy lên web mới thấy lỗi undefined vì đúng ra phải là user.name.

  • TS: Ba vừa gõ user.nam là nó gạch chân đỏ lòm ngay trong VS Code, báo "Sai rồi ba ơi, không có thuộc tính nam đâu". Cái này cực sướng khi project lớn dần.

• Code tự giải thích (Self-documenting):

  • JS: Nhìn hàm function add(a, b), ba không biết a, b là số hay là chuỗi.

  • TS: function add(a: number, b: number), nhìn vào biết ngay phải truyền số. Sau này ba (hoặc con) đọc lại code cũ sẽ hiểu ngay logic mà không cần mò mẫm.

• Refactor an toàn:

  • Khi ba muốn đổi tên một biến dùng ở 10 file khác nhau. Với TS, ba đổi 1 chỗ, nó tự sửa 10 chỗ kia chuẩn xác. Với JS, ba phải đi Ctrl+F tìm và sửa thủ công (dễ sót).

2. Đổi từ JS qua TS có phức tạp không?

Dạ, CÓ và KHÔNG.

• KHÔNG phức tạp nếu ba làm dự án mới tinh từ đầu (Greenfield Project). Lúc đó thiết lập sẵn TS rồi cứ thế mà code, rất sướng.

• RẤT phức tạp khi ba "nâng cấp" một dự án đang chạy (Legacy Project) - đây chính là trường hợp của chúng ta vừa rồi.

Tại sao lại phức tạp?

1. Cú sốc văn hóa: JS cho phép ba viết code "thoải mái" (lỏng lẻo), còn TS bắt bẻ từng tí một. Code cũ đang chạy ngon, chuyển sang đuôi .ts cái là nó báo đỏ rực cả màn hình vì thiếu kiểu dữ liệu.

2. Cấu hình (Config): Phải cài đặt tsconfig.json, sửa lại cách import/export (như lỗi module has no exported member mình vừa gặp).

3. Thư viện bên thứ 3: Nhiều thư viện JS cũ không hỗ trợ TS tốt, phải cài thêm @types/... hoặc viết file khai báo riêng, rất mất thời gian.

🌟 Lời khuyên của Mỡ (Architect Strategy)

Với tình hình hiện tại của dự án ba (SvelteKit đang chạy ổn định với JS):

1. Đừng "Cuồng" TS: Không nhất thiết phải chuyển đổi 100% sang TS ngay lập tức. SvelteKit hỗ trợ chế độ "lai" (Hybrid), tức là file .js và .ts sống chung được.

2. Áp dụng từ từ:

   • Các file logic quan trọng, dùng nhiều nơi (như store, firebase, utils): Nên chuyển sang TS (như mình vừa làm). Vì đây là nền móng, cần chắc chắn.

   • Các file giao diện (.svelte): Cứ để JS cũng được, hoặc thêm lang="ts" nhưng đừng quá khắt khe về kiểu dữ liệu (dùng any nếu lười định nghĩa).

3. Quy tắc "Boy Scout" (Hướng đạo sinh): Mỗi lần ba mở một file cũ ra để sửa lỗi hoặc thêm tính năng, tiện tay thì chuyển file đó sang TS. Cứ thế dần dần cả dự án sẽ sạch đẹp mà không bị "sốc".

Tóm lại: TS rất đáng giá về lâu dài, nhưng chuyển đổi thì cần chiến thuật du kích (từng chút một) chứ không nên tổng tấn công (làm hết một lượt) như hôm nay ba con mình làm đâu ạ! ❤️

---

Phần 2: Nguồn gốc lịch sử (Tại sao lại đẻ ra lắm thứ thế?)

👨 Ba: Vậy tại sao lại có sự ra đời của JS và TS hả Mỡ?

👧 Mỡ: Dạ ba, câu hỏi này đụng đúng vào "long mạch" của lịch sử phát triển Web luôn!

Để hiểu tại sao chúng ta lại có sự tồn tại song song của hai ngôn ngữ này, con sẽ kể cho ba nghe một câu chuyện ngắn về sự tiến hóa của thế giới Web dưới góc nhìn của một Architect nhé. Nó giống như quá trình loài người đi từ nhà lá lên nhà chọc trời vậy.

1. Sự ra đời của JavaScript (JS): "Đứa con của sự vội vã"

Bối cảnh (Năm 1995):

Hồi đó, Internet rất chán, chỉ toàn là văn bản và hình ảnh tĩnh (HTML/CSS). Web giống như một tờ báo giấy, ba đọc xong là hết, không tương tác được gì cả.

Lý do ra đời:

Hãng Netscape (trình duyệt thống trị thời đó) muốn trang web phải "động đậy" được: di chuột vào thì đổi màu, bấm nút thì hiện thông báo, kiểm tra xem người dùng đã điền email chưa...

Sự thật thú vị:

Ông Brendan Eich (cha đẻ của JS) đã tạo ra bản mẫu đầu tiên của JavaScript chỉ trong vòng... 10 ngày.

• Mục tiêu: Phải dễ học, linh hoạt, lỏng lẻo để ai cũng viết được (ngay cả người không chuyên code).

• Hệ quả: Vì làm quá gấp và ưu tiên sự dễ dãi, JS có rất nhiều thiết kế "kỳ quặc" và thiếu các quy tắc chặt chẽ (ví dụ: 1 + "1" = "11", nhưng 1 - "1" = 0).

=> JS sinh ra để làm các việc vặt vãnh (scripting) trên trình duyệt.

 

2. Sự ra đời của TypeScript (TS): "Kẻ thiết lập trật tự"

Bối cảnh (Khoảng năm 2010 - 2012):

Lúc này Web đã thay đổi hoàn toàn. Web không còn là trang tin tức nữa, mà trở thành các Ứng dụng khổng lồ (Google Maps, Gmail, Facebook, Office Online...). Một dự án không còn là 100 dòng code nữa, mà là hàng triệu dòng code với hàng trăm lập trình viên cùng làm.

Vấn đề của JS:

Khi quy mô lớn lên, sự "dễ dãi" của JS trở thành thảm họa:

• Ba viết user.name, nhưng người khác trong team lại lỡ tay sửa thành user.fullName. JS không báo lỗi gì cả, cho đến khi người dùng chạy web lên thì... BÙM! Lỗi trắng trang.

• Không ai dám sửa code cũ vì sợ sửa chỗ này hỏng chỗ kia (do không có cơ chế kiểm tra sự liên kết).

Lý do TS ra đời:

Microsoft (cụ thể là Anders Hejlsberg - cha đẻ của C#) thấy tình hình này không ổn. Họ cần một công cụ giúp viết JS nhưng phải an toàn và chặt chẽ như C# hay Java.

Giải pháp:

Họ tạo ra TypeScript.

• TS = JS + Type (Kiểu dữ liệu).

• TS không phải là ngôn ngữ mới hoàn toàn, nó là "lớp vỏ bảo vệ" bao bọc lấy JS.

• Nhiệm vụ: Bắt lỗi ngay lúc ba đang gõ code, không đợi đến lúc chạy mới báo.

=> TS sinh ra để quản lý các hệ thống phần mềm lớn, phức tạp và cần sự bền vững.

Tóm tắt sự khác biệt bằng hình tượng (Architect View)

Để ba dễ hình dung nhất:

Tại sao chúng ta lại chuyển qua TS (như trường hợp của ba con mình)?

Hồi nãy ba con mình gặp rắc rối chính là vì chúng ta đang muốn nâng cấp ngôi nhà.

• Code cũ của ba là JS (linh hoạt nhưng lộn xộn).

• Mỡ muốn đưa nó về TS (có quy hoạch rõ ràng) để sau này ba muốn thêm tính năng mới, ba không sợ làm sập tính năng cũ.

Kết luận:

• JavaScript giúp Internet trở nên sống động.

• TypeScript giúp các kỹ sư ngủ ngon hơn khi xây dựng Internet.