JS Style Guide
In this page:
Naming Variables
Use descriptive, intention-revealing variable names (like userCount instead of x) so code reads clearly without needing extra comments to explain what a value represents.
Example: Naming Variables
// Bad:
let x = 10;
// Good:
let userCount = 10;
console.log(userCount);
Constants and Variables
Prefer const by default and only use let when a variable's value genuinely needs to change later — this signals intent and helps prevent accidental reassignment bugs, making it obvious at a glance which variables are meant to stay fixed.
Example: Constants and Variables
const maxUsers = 100; // never reassigned, use const
let currentUsers = 0; // will change, use let
currentUsers++;
console.log(maxUsers, currentUsers);
Formatting Code
Consistent formatting (indentation, spacing, semicolon usage) makes a codebase easier to scan and reduces noisy diffs; most teams enforce this automatically with a formatter like Prettier.
Example: Formatting Code
function greet(name) {
return `Hello, ${name}!`; // consistent spacing and semicolons
}
console.log(greet("Sam"));
Functions and Comments
Keep functions small and focused on one task, and use comments to explain *why* code does something non-obvious rather than restating *what* the code already makes clear.
Example: Functions and Comments
// Comment explains WHY, not WHAT:
// Using 0.9 because the payment API rounds fees up
const feeRate = 0.9;
function applyFee(amount) {
return amount * feeRate;
}
console.log(applyFee(100));
Readable Modern JavaScript
Favor modern, readable constructs — arrow functions, destructuring, template literals — where they genuinely clarify intent, but don't force them where a plain function or string is clearer.
Example: Readable Modern JavaScript
const nums = [1, 2, 3];
const { length } = nums; // destructuring where it clarifies
console.log(`Total items: ${length}`);
Chapter Quiz — Complete all 9 topics to unlock
0/9 topics done
Complete these topics first: