Home » Thủ thuật giúp code đẹp và dễ đọc hơn

Thủ thuật giúp code đẹp và dễ đọc hơn

  • by

Bạn đã bao giờ chăm chút cho từng dòng code của mình chưa. Việc viết code không khó, nhưng để có được một đoạn code đẹp, dễ hiểu. Chúng ta phải trau chuốt rất nhiều.

Theo thống kê thời gian để code thực chất ít hơn rất nhiều với thời gian đọc code, tỉ lệ có thể là 1 vs 10.

Nếu như chúng ta code không có tâm, code bừa, code cho xong thì bạn sẽ thấy ảnh hưởng rất lớn. Ban đầu bạn có thể thấy tiến độ dự án rất nhanh, nhưng dần dà sẽ phát sinh rất nhiều bugs, kéo theo cả dự án chậm trễ. Chưa hết khi bạn không còn làm trong dự án đó, những người tiếp quản công việc của bạn sẽ chết ngộp trong đống code mà bạn tạo ra.

Code đẹp là code có thể đọc, việc đọc và hiểu những legacy code của bạn cực kỳ quan trọng. Do đó, chúng ta cùng điểm qua một số cách để code dễ đọc hơn nhé.

Code theo một Style Guide

Style Guide là những nguyên tắc, quy chuẩn như cách đặt tên biến, tên file, cách tổ chức thư mục, cách tạo module, class, … Những hướng dẫn để code được đồng bộ hơn, những best practice, những việc cần làm và những việc cần tránh. Bạn có thể tham khảo một số style guide sau của Angular, Javascript, …

Viết những hàm ngắn hơn

Bạn hãy chia một hàm phức tạp thành nhiều hàm đơn giản hơn. Có thể một hàm khoảng 75 dòng. Nếu hàm của chúng ta quá dài, bạn có thể nghĩ hàm đó đang làm nhiều hơn một nhiệm vụ, có thể 2,3 nhiệm vụ. Hãy chia nhỏ chúng. Mỗi hàm chỉ nên làm một việc và mỗi file chỉ nên thuộc về một business.

Đặt tên đúng chính tả và đồng bộ với nhau

Lưu ý đến chính tả và đồng bộ của các biến, hàm. Hãy dùng cùng một tên để nói đến cùng một business.

Đặt tên đúng ý nghĩa

Việc đặt tên cũng cực kỳ quan trọng. Chúng ta đặt tên mọi thứ trong dự án như, tên dự án, tên thư mục, tên file, tên biến, tên hàm, … Hãy cân nhắc và thảo luận cùng đồng nghiệp của bạn để chọn ra những tên ý nghĩa, đúng với chức năng của nó. Chọn tên có thể mất nhiều thời gian nhưng sẽ tiết kiệm thời gian đọc code.

Sử dụng comment khôn ngoan hơn

Không dùng comment để giải thích đoạn code này là gì? Ví dụ //here is end of div, nên sử dụng khi giải thích tại sao lại làm cái này, hay giải thích một luồng dữ liệu.

Nhóm và sắp xếp các biến, hàm có trật tự trong một file

Tổ chức một file của bạn thật gọn gàng và sắp xếp ngăn nắp các biến, các hàm.

Quy tắc 5 giây

Đọc một hàm trong 5 giây, nếu không hiểu nó có thể bạn sẽ xóa nó và viết lại. Và hàm đó có thể dài, có thể làm nhiều việc. Hãy viết lại nó. Nếu hàm quá dài, hãy abstract những hàm bên trong hàm lớn.

Định dạng code đẹp hơn, có thể như Prettier

Định dạng code với các khoảng cách, xuống dòng, tabs,… một cách đồng bộ. Code sẽ trông gọn gàng và dễ đọc hơn.

Việc viết code dễ đọc sẽ giúp chúng ta dễ bảo trì code hơn, làm cho sếp của bạn vui hơn, cho những lập trình viên phía sau bạn, có thể cho bạn nữa có cuộc sống tươi sáng hơn.

Theo Topdev