7 mẹo giúp bạn “clean code” trong Javascript

7 Tips for Clean Code in JavaScript You Should Know

Là một lập trình viên bạn sẽ dành nhiều thời gian để đọc code hơn là viết nó. Đó là lý do tại sao điều quan trọng là phải viết làm sao đó để có thể dễ đọc và dễ nâng cấp sau này. Trong bài viết này tôi xin chia sẻ 7 mẹo giúp code của bạn trong gọn gàng và sạch sẽ hơn.

Xin được lưu ý rằng đây chỉ là những mẹo giúp các bạn và một số bạn có thể không đồng ý với điều đó. Nếu như các bạn có ý kiến hay hơn có thể bình luận ở phía bên dưới bài viết này.

Sử dụng tên có ý nghĩa

Đúng, đặt tên cho mọi thứ rất khó. Tuy nhiên những cái tên vô nghĩa sẽ gây khó hiểu sau một thời gian chúng ta cần chỉnh sửa cập nhật lại nó. Khi bạn cần chọn một tên cho hàm hay biến hãy đặt những cái tên mang mục đích và ngữ cảnh của nó.

[javascript]
function signup(email, password) {
const user = new User(email, password);
//
}
[/javascript]

Chuyển các giá trị về hằng số

Với những giá trị không bị thay đổi hoặc bạn không muốn nó bị thay đổi, bạn lên đưa nó về thành hằng số. Điều này vừa giúp đoạn code của bạn trở lên gọn gàng và tránh luôn được biến đó có thể bị thay đổi giá trị trong quá trình thực thi dòng lệnh.

[javascript]
const DECK_SIZE = 52;

for (let i = 0; i < DECK_SIZE; i++) { // } [javascript]

Không nên sử dụng boolean để xác định chạy hàm

Thông thường khi bạn có một hàm có vài lệnh thực thi giống nhau. Để chuyển giữa những thứ đó bạn sử dụng biến boolean như một dấu hiệu để nhận biết. Điều đó làm cho mỗi thứ trở nên phức tạp hơn. Thay vào đó bạn nên tách chúng ra thành các hàm riêng biệt.

[javascript]
function loadSchema(schema) {
//
}

function loadSchemaSync(schema) {
//
}

// One eternity later

loadSchemaSync();
[/javascript]

Giảm việc code lồng code

Việc code lồng trong code sẽ khiến code của bạn khó đọc hơn. Hãy tách chúng ra thành các hàm riêng biệt để xử lý các tiến trình khác nhau.

[javascript]
async function handle(request) {
if (!request.user) {
// User is not authenticated.
return new Response({ status: 401 });
}

if (!request.user.can(“CREATE_POST”)) {
// User is not authorized.
return new Response({ status: 403 });
}

// We can safely assume the user
// is authenticated and authorized.
// Handle request here.
}
[/javascript]

Sử dụng các toán tử mới

Do ngôn ngữ lập trình Javascript luôn thay đổi không ngừng. Điều này giúp bạn các các hàm, toán tử mới giúp ngắn các đoạn code của bạn lại.

[javascript]
// Let’s use nullish-coalescing (`??`).
const port = config.port ?? 3000;

// The numeric separator makes it easy to tell.
const oneBillion = 1_000_000_000;

// Here, we can use optional-chaining.
if (user.team?.subscription?.invoices) {
//
}
[/javascript]

Code tái sử dụng

Việc tái sử dụng lại các đoạn code rất dễ dàng. Chúng vừa giúp code trở nên ngắn gọn, vừa đảm bảo tính đồng nhất trong ứng dụng. Việc đó khiến bạn cần phải kỹ càng hơn trong các hàm vì có thể gây ra ảnh hưởng chung tới những nơi sử dụng nó. Việc có những đoạn code tự động kiểm tra lại các hàm rất quan trọng.

  1. Tái sử dụng components trong React Native
  2. Use Enzyme for testing React Native Component

Sử dụng ESLint

ESLint sẽ giúp bạn kiểm tra những lỗi về code thường hay gặp phải. Ngoài ra bạn có thể cài đặt thêm những plugin để phát hiện ra nhiều hơn và định dạng lại đoạn code của trở nên ngay lề thẳng lối.

Còn rất nhiều cách khác nhau để giúp code của bạn có thể trở lên gọn gàng và dễ bảo trì hơn. Nếu như bạn còn ý kiến nào hãy bình luận bên dưới để mình có thể học hỏi và bổ sung thêm.

Chúc bạn thành công !