TypeScript:
Tái cấu trúc mã

Làm thế nào:

Xem xét một hàm TypeScript đã qua thời hoàng kim - nó hơi bừa bộn và cần được chăm sóc một cách tỉ mỉ:

function userInfo(data: any): string {
    return "User Info: " + data.name + ", " + data.age + ", " + data.email + ";" ;
}

Sau khi tái cấu trúc, nó có thể trông như thế này:

interface User {
    name: string;
    age: number;
    email: string;
}

function formatUserInfo(user: User): string {
    return `User Info: ${user.name}, ${user.age}, ${user.email};`;
}

Ví dụ thứ hai chắc chắn hơn, tận dụng hệ thống kiểu của TypeScript với một interface để tránh lỗi thời gian chạy tiềm ẩn và cải thiện khả năng đọc.

Sâu hơn

Tái cấu trúc không phải là một khái niệm hiện đại; nó phát triển cùng với lập trình, trở nên được chuẩn hóa hơn với sự ra đời của cuốn sách “Refactoring: Improving the Design of Existing Code” của Martin Fowler vào năm 1999. Điều này cực kỳ quan trọng trong môi trường phát triển Agile, thúc đẩy việc thay đổi mã linh hoạt. Một số phương pháp thay thế cho việc tái cấu trúc thủ công bao gồm các công cụ tự động như TSLint hoặc chính máy chủ ngôn ngữ TypeScript có thể đề xuất hoặc thậm chí thực hiện một số tác vụ tái cấu trúc cho bạn. Chi tiết thực hiện thường liên quan đến việc nhận biết “mùi mã” như mã trùng lặp, phương thức dài, hoặc lớp lớn, và áp dụng mẫu để khắc phục—như trích xuất phương thức, di chuyển sang lớp phù hợp hơn, hoặc sử dụng cấu trúc đơn giản hơn. Những mẫu này là chìa khóa để hiểu về cách và lý do của việc tái cấu trúc.

Xem thêm