const: When you want a guarantee

const is your default choice. It creates a variable that cannot be reassigned once initialized. Think of it like writing with a permanent marker, once it's set, it's set.

const API_URL = "https://api.example.com";
const MAX_RETRIES = 3;
const userName = "Alice";

// This will throw an error:
// userName = "Bob"; // TypeError: Assignment to constant variable

But wait, const doesn't make values immutable, just the binding. If you store an object or array, you can still modify what's inside:

const user = { name: "Alice", age: 25 };
user.age = 26; // This works fine!
user.name = "Bob"; // This too!

// But this won't work:
// user = { name: "Charlie" }; // TypeError!

let: For things that change

Sometimes you genuinely need a variable that changes. Counters, accumulators, loop indices, these are perfect for let:

let score = 0;
score = 10;
score += 5;

let currentUser = null;
currentUser = fetchUser(); // Assigned later

The temporal dead zoneWhat is temporal dead zone?The period between entering a scope and the let/const declaration being reached, during which accessing the variable throws a ReferenceError. Ask AI for more

Here's something that trips up AI tools: they sometimes reference a let variable before it's declared, even though the declaration gets "hoisted" (moved to the top of the scopeWhat is scope?The area of your code where a variable is accessible; variables declared inside a function or block are invisible outside it. Ask AI for more):

console.log(name); // ReferenceError!
let name = "Alice";

This is actually a feature, not a bug. It prevents you from accidentally using undefined variables.

var: Just don't

var was JavaScript's original variable declaration, introduced in 1995. It has two major problems that have caused countless bugs over the decades.

Problem 1: Function scopeWhat is scope?The area of your code where a variable is accessible; variables declared inside a function or block are invisible outside it. Ask AI for more, not block scope

function example() {
  if (true) {
    var secret = "I'm inside the if block";
  }
  console.log(secret); // Works! (But shouldn't)
}

With var, the variable exists throughout the entire function, not just the block where it was declared. This violates the principle of least privilege, variables should only be accessible where they're needed.

Problem 2: Variable hoistingWhat is hoisting?JavaScript's behavior of moving function and variable declarations to the top of their scope during compilation, so they can be referenced before they appear in the code. Ask AI for more quirks

console.log(mystery); // undefined (not an error!)
var mystery = "What am I?";

var declarations are hoisted to the top of their scope and initialized with undefined. This silently fails instead of throwing an error, making bugs harder to find.

Naming conventions in AI output

AI-generated code usually follows naming conventions, but not always consistently. Here's what to expect and what to enforce:

Naming rules

• Must start with a letter, underscore, or dollar sign: name, _private, $element
• Can contain letters, numbers, underscores, dollar signs: userName2, _tempValue
• Cannot use reserved words: const, function, class, etc.
• Case-sensitive: Name and name are different variables

Style conventions you'll see in AI output

JavaScript uses camelCase for regular variables. AI usually gets this right, but watch for inconsistencies when it mixes conventions across generated files:

const userName = "Alice";      // camelCase ✓
const user_name = "Alice";     // snake_case (Python style)
const UserName = "Alice";      // PascalCase (usually for classes)
const USERNAME = "Alice";      // SCREAMING_SNAKE_CASE (usually for constants)

Quick reference