Một vài mẹo nhỏ để viết Javascript tốt hơn


Tips for better JS coding.png 351 KB
Xin chào các anh chị và các bạn. Trong một buổi sáng thứ 5 “mát mẻ” của Hà Nội đầu tháng 6, mình vô tình lướt qua “Cuộc thi Viết” của ITviec.com, sẵn đang có một vài chủ đề vừa đọc được và đã bỏ túi, nay mình sẽ lược dịch và viết lại để chia sẻ tới cộng đồng developer trong nước.

Chủ đề hôm nay mà mình chia sẻ là Một vài mẹo nhỏ để viết Javascript tốt hơn. Trong bài viết mình sẽ giữ nguyên nhiều thuật ngữ bằng tiếng Anh vì sự thông dụng và tương đối dễ hiểu. (do mình cũng không biết dịch như nào cho nó hợp nữa, bạn nào biết thì chỉ mình thêm)

Đặt tên biến (Variable) và đặt tên hàm (Function) rõ ràng


Không cần phải bàn cãi thêm về tầm quan trọng của việc đặt tên các Variable và/hoặc tên các Function. Việc đặt tên rõ ràng và dễ hiểu ngay từ đầu dự án cũng giúp cho các Lập trình viên khác trong cùng dự án có thể dễ dàng đọc hiểu và debug code của bạn.

Một vài mẹo bạn có thể ghi nhớ:

  • Nên sử dụng nhiều hơn 1 từ để đặt tên biến (trong nhiều trường hợp): firstName / lastName / fullName (thay vì chỉ name)
  • Và sử dụng cách gộp nhiều từ theo dạng camelCase (viết thường chữ cái đầu tiên của từ đầu tiên và viết hoa chữ cái đầu tiên của tất cả các từ tiếp theo): firstSecondThird
  • Đưa tính từ (adjective) sang phía bên trái, ví dụ: premiumUsers, featuredProducts, ..
  • Khi biến có kiểu dữ liệu boolean (có hoặc không), hãy đặt tên với is/are/has: isDarkMode, hasAdminAccess, isAdmin, areLoggedIn, …
  • Đặt tên biến chính xác với mục đích sử dụng nó: fullName, billingAddress, … (đừng đặt tên biến là tenBien dù không ai cấm bạn cả)
  • Nên đặt tên hằng số (constant) theo dạng UPPERCASE và ngăn từ bằng một dấu gạch “_” (underscore), ví dụ: MAX_LOGIN_ATTEMP = 5, MAX_ALLOWED_CONNECTION = 8, …
Bằng việc đặt tên các biến và hàm rõ ràng từ đầu dự án, bạn sẽ mang đến dự án của mình một sự nhất quán và rõ ràng trong các ngôn ngữ lập trình mà mình sử dụng, không riêng gì Javascript.

Trong thời đại mà việc làm việc online và collaboration cùng nhau đã trở nên quá phổ biến thì việc giữ cho code của mình dễ đọc, dễ hiểu và dễ sử dụng nên được xem như là một ưu tiên của developer. Code của bạn không chỉ hoạt động tốt, mà nó còn được viết chỉnh chu nữa. Thật tuyệt phải không nào?

Sử dụng “comments” trong code


Việc sử dụng comment để giải thích một dòng hoặc một đoạn code ở trong chương trình của mình là một điều rất cần thiết mà mọi developer nên làm.

Hãy nghĩ về việc bạn không chỉ code một mình ở trong một dự án, việc bạn comment các đoạn code của mình giúp cho những developer khác làm việc cùng dự án có thể hiểu được dễ dàng hơn về đoạn code của bạn, từ đó giúp việc cộng tác cũng trở nên dễ dàng hơn.

Hãy sử dụng comments một cách hiệu quả, viết nó ngắn gọn và dễ hiểu, giải thích về một hoặc toàn bộ code của mình.

Hoặc dùng nó như một lời nhắc bản thân, tôi thường comment #TODO: do something ở trong code của mình để nhắc bản thân về nhũng đoạn cần phải bổ sung hoặc quay lại revise sau.

Sử dụng công cụ “Code Formatting”


Code được xem là “xịn” khi mà nó không chỉ hoạt động tốt về mặt tính năng, mà còn dễ dàng đọc hiểu về mặt kỹ thuật, nghĩa là code được viết “đúng form(at)”. Đúng format, đúng phỏm hay còn gọi là vào khuôn.

Để code của bạn được format “chuẩn” thì sử dụng công cụ là điều nên làm để hạn chế tối đa việc mất thời gian của bản thân, “don’t reinvent the wheel”. Các công cụ code formatting phổ biến như ESLintPrettier sẽ giúp bạn làm điều này.

Click vào link để tìm hiểu thêm về 2 công cụ này nhé, mình sẽ nói sơ qua về nó như sau: ESLint là công cụ tìm, xác định và fix những lỗi thông dụng trong code của bạn dựa theo chuẩn ECMAScript/Javascript, còn Prettier là công cụ “format” lại code của bạn để đẹp về phần nhìn, thật đấy.

Viết code theo dạng Module và có thể ‘tái sử dụng’


Một trong những cách để tiến bộ hơn trong coding là ‘mô-đun hóa’ nó, nghĩa là ‘xé’ nhỏ nó ra thành từng phần có thể sử dụng lại. Việc này vè lâu dài mang lại lợi ích rất lớn khi chương trình của bạn ngày một phát triển và lớn hơn, nhất là trong việc xác định lỗi và sửa lỗi.

Ngoài ra việc mô-đun hóa code cũng giúp cho bạn tránh việc lặp lại các hàm. Bạn có thể viết ra một hàm và sử dụng nó ở trong nhiều phần khác nhau trong cùng 1 dự án.

Việc ‘xẻ thịt’ code của mình còn giúp cho quá trình Kiểm thử (testing) hiệu quả hơn vì mỗi hàm đều có thể được test riêng.

Viết unit tests


Unit test là phần không thể thiếu trong quá trình viết code. Nó giúp developer có thể kiểm tra được rằng code của mình hoạt động đúng như yêu cầu, và giúp xác định lỗi trong code.

Sử dụng các Library và Frameworks


Sự phát triển mạnh mẽ của các cộng đồng developer trên thế giới ở trong nhiều ngôn ngữ lập trình mang đến cho lập trình viên vô vàn những lựa chọn về các LibraryFramework. Chúng ta sẽ không cần phải khổ sở để viết một chương trình từ từng dòng code đầu tiên nữa.

Sử dụng Framework để bắt đầu lập trình không còn quá xa lạ trong thế giới lập trình viên nữa, một số framework Javascript nổi tiếng trên thế giới hiện nay mà bạn có thể đã nghe như: ReactJS, Angular, Vue.JS, ….

Hãy tận dụng những thứ sẵn có này để “push” khả năng làm việc của bạn lên một tầm cao hơn.

Hy vọng rằng những mẹo nhỏ này sẽ giúp được bạn ít nhiều trong công việc cũng như là đam mê của mình.