Airbnb JavaScript Style Guide: Quy Ước Viết Code

Tìm Hiểu Về Airbnb JavaScript Style Guide

Airbnb JavaScript Style Guide là tài liệu công khai tổng hợp quy ước viết code JavaScript, duy trì tại repository GitHub airbnb/javascript, bao quát từ primitive/reference đến object, array, string, và function. Mỗi quy tắc có lý do ngắn gọn cùng ví dụ code sai/đúng, nhiều quy tắc gắn với một ESLint rule cụ thể như prefer-const hay object-shorthand. Hướng dẫn giả định dùng Babel và liên kết tới hướng dẫn đồng hành cho React và CSS-in-JavaScript.

Nguyên Tắc Và Quy Ước Viết Code Chính

• ✓Yêu cầu dùng const cho biến không gán lại và let cho biến có gán lại, cấm hẳn var, dựa trên hai ESLint rule là prefer-const và no-var.
• ✓Quy định let và const có block scope còn var có function scope, kèm ví dụ code cho thấy lỗi ReferenceError xảy ra khi hiểu sai điều này.
• ✓Ưu tiên cú pháp literal thay vì constructor: dùng {} thay cho new Object(), và [] thay cho new Array(), mỗi quy tắc gắn với một ESLint rule riêng.
• ✓Dùng object spread ({ ...original, c: 3 }) thay cho Object.assign khi copy nông một object, vì Object.assign trên object có sẵn sẽ làm thay đổi (mutate) chính object đó.
• ✓Yêu cầu destructuring object khi truy cập nhiều property cùng lúc và khi trả về nhiều giá trị từ function, dựa trên ESLint rule prefer-destructuring.
• ✓Chuyển iterable thành array bằng spread (...foo), nhưng chuyển sang Array.from(foo, bar) khi cần map, để tránh tạo ra một array trung gian.
• ✓Chuẩn hóa dùng single quote cho string và template literal khi ghép chuỗi, đồng thời cấm hẳn eval().
• ✓Yêu cầu dùng named function expression thay vì function ẩn danh hay function declaration, và bọc IIFE trong dấu ngoặc theo rule wrap-iife.

Ai Được Lợi Từ Hướng Dẫn Này?

Airbnb JavaScript Style Guide phù hợp với team đã dùng Babel và ESLint, muốn có một chuẩn viết code rõ ràng theo từng quy tắc thay vì tự soạn từ đầu. Riêng phần const/let/var đã giải quyết một tranh cãi mà nhiều team vẫn xử lý theo kiểu không chính thức. Nó ít phù hợp hơn cho dự án cá nhân hay team đã hài lòng với cấu hình linter hiện tại, vì áp dụng nó nghĩa là phải đối chiếu lại từng quy tắc đang dùng với lựa chọn riêng của Airbnb.

Các Hướng Dẫn Phong Cách JavaScript Phổ Biến Khác

Câu Hỏi Thường Gặp

Trường Hợp Sử Dụng Tốt Nhất

• •Khởi tạo cấu hình ESLint cho một team mới bằng cách áp dụng các rule có tên sẵn của Airbnb (prefer-const, no-var, object-shorthand, quotes) làm bộ quy tắc nền.
• •Chấm dứt tranh cãi lặp đi lặp lại trong code review về const/let/var, kiểu quote, hay Object.assign so với spread, bằng cách trỏ tới một quy tắc đã viết ra rõ ràng.
• •Dạy một developer mới làm quen với cú pháp ES6+ bằng các cặp ví dụ code sai/đúng của hướng dẫn cho destructuring, template literal, và spread.
• •Mở rộng cùng bộ quy ước sang codebase React thông qua hướng dẫn React đi kèm mà repo liên kết tới trong mục Other Style Guides.
• •Rà soát cách một codebase JavaScript hiện có đang xử lý object, array, và string, đối chiếu với một tài liệu tham khảo bên ngoài thay vì kinh nghiệm truyền miệng trong team.

Repo liên quan