Cách đặt tên biến trong JavaScript: Quy tắc và ví dụ

Biến là "container" có tên để lưu trữ và tham chiếu dữ liệu. Đặt tên đúng quy tắc giúp code sạch, dễ hiểu, tránh lỗi cú pháp.

Quy tắc bắt buộc (Syntax)

Không dùng reserved keywords: break, boolean, class, const, function... (xem danh sách reserved words).
Không bắt đầu bằng số (0-9): Phải bắt đầu bằng chữ cái, _ hoặc $.
Phân biệt chữ hoa/thường: Name và name là 2 biến khác nhau.
Chỉ chứa: Chữ cái (a-z, A-Z, Unicode), số (0-9), gạch dưới _, dấu đô la $.

Ví dụ hợp lệ / Không hợp lệ


// ✅ Hợp lệ
var rank;
var points;
var _privateVar;
var $element;
var userName;
var user_name;
var 名前;        // Unicode OK
var $;          // Chỉ $ OK
var _;          // Chỉ _ OK

// ❌ Không hợp lệ
var 2name;      // Bắt đầu bằng số
var user-name;  // Có dấu gạch ngang
var class;      // Reserved word
var export;     // Reserved word
var my var;     // Có khoảng trắng

Quy ước đặt tên (Naming Conventions)

Loại	Convention	Ví dụ
Biến, hàm, tham số, property	camelCase	`userName`, `getUserById()`, `maxCount`
Class, Constructor, Component	PascalCase	`UserAccount`, `Button`, `ApiClient`
Hằng số toàn cục (constant)	UPPER_SNAKE_CASE	`MAX_SIZE`, `API_URL`, `DEFAULT_TIMEOUT`
Private/Internal (convention)	_camelCase	`_internalCache`, `_calculateTotal()`
Boolean	is/has/can/should + PascalCase	`isActive`, `hasPermission`, `canEdit`
Event handler	on + PascalCase / handle + PascalCase	`onClick`, `handleSubmit`

Ví dụ khai báo thực tế

Mẹo đặt tên hay

Đặt tên theo vai trò: users (mảng), user (đối tượng đơn), userMap (Map), userById (object lookup).
Tránh từ chung chung: data, info, obj, val – trừ scope rất hẹp.
Độ dài phù hợp: Scope rộng → tên dài, rõ nghĩa. Scope hẹp (loop index) → i, j OK.
Nhất quán: Chọn 1 convention cho codebase (camelCase cho biến/hàm là chuẩn JS).

Công cụ kiểm tra tự động

ESLint: camelcase, id-denylist, id-match, id-length.
TypeScript: Type annotation giảm thiểu tên biến mô tả kiểu (userStr → user: string).