Di chuyển JS sang TS

Hầu hết dự án đến với TypeScript khi đã là một codebase JavaScript đang chạy. Cám dỗ lớn nhất là "viết lại hết cho sạch" - và đó thường là sai lầm đắt giá. Cách bền vững là di chuyển dần: cho TypeScript và JavaScript sống chung rồi thêm kiểu từng phần. Tuỳ chọn allowJs trong tsconfig cho phép điều đó:

{
  "compilerOptions": {
    "allowJs": true,    // cho phep co ca file .js
    "checkJs": true,    // va soi kieu luon ca file .js
    "outDir": "dist"
  }
}

• ▸Di chuyển dần an toàn hơn viết lại: vừa chạy vừa thêm kiểu, không chặn tính năng mới.
• ▸allowJs cho .js và .ts cùng tồn tại trong một dự án.
• ▸checkJs bật kiểm kiểu cho cả file .js, không cần đổi đuôi ngay.

Bất ngờ thú vị: bạn gắn kiểu cho file .js mà KHÔNG cần đổi đuôi, qua JSDoc. Thêm // @ts-check ở đầu file là TypeScript bắt đầu soi, và JSDoc cho nó biết kiểu:

// @ts-check
/**
 * @param {number} a
 * @param {number} b
 * @returns {number}
 */
function tong(a, b) {
  return a + b;
}

tong("2", 3);   // "2" la string, khong phai number

error TS2345: Argument of type 'string' is not assignable to parameter of type 'number'.

• ▸// @ts-check bật kiểm kiểu cho riêng một file .js.
• ▸JSDoc @param/@returns/@type gắn kiểu mà không đổi đuôi file.
• ▸Đây là cây cầu đầu tiên: có an toàn kiểu ngay trên code JS cũ.

Khi một file đã ổn với JSDoc, đổi nó sang .ts và chuyển chú thích vào thẳng code. Sẽ có chỗ khó hoặc phụ thuộc thứ chưa migrate - lúc đó dùng any hoặc @ts-expect-error như lối thoát tạm thời, kèm ghi chú để còn quay lại:

// @ts-expect-error - TODO: sua kieu sau khi migrate xong module cu
const cauHinh: number = layCauHinhCu();

// Hoac danh dau ro bang any tam thoi
/** @type {any} TODO: thay bang kieu that */
let duLieu = layDuLieuChuaCoKieu();

Đừng bật strict toàn cục ngay từ đầu trên một dự án JS lớn - hàng nghìn lỗi đổ ra một lúc làm nản lòng. Đi từng bước:

• ▸Bắt đầu lỏng (strict tắt, hoặc bật từng cờ một như noImplicitAny trước).
• ▸Di chuyển từ module "lá" (ít phụ thuộc) vào dần các file phụ thuộc.
• ▸Khi phần lớn đã có kiểu, bật strict toàn cục và dọn nốt các any/@ts-expect-error còn nợ.

Di chuyển sang TypeScript là một hành trình dần: cho JS và TS sống chung bằng allowJs, gắn kiểu bằng JSDoc, đổi đuôi rồi siết strict từng bước, dùng lối thoát tạm có đánh dấu. Mèo con giờ có đủ công cụ để đưa TypeScript vào bất kỳ dự án thật nào.