Variable

Explanation

In JavaScript, variables are declared with const, let, or var. const declares a constant — the binding cannot be reassigned (though object properties can still be mutated). let declares a block-scoped variable that can be reassigned. var is function-scoped and hoisted — a pre-ES6 relic that should be avoided in modern JavaScript. The rule of thumb: use const by default, use let when you need to reassign, never use var. Under the hood, a variable is a binding: it associates a name with a value stored somewhere in memory. Primitive values (numbers, strings, booleans, null, undefined, Symbol, BigInt) are stored directly; objects, arrays, and functions are stored by reference — the variable holds a pointer to the object's memory location, not the object itself. This distinction explains why const {a} = obj still allows obj.a to be mutated (you're mutating the object the variable points to, not the variable binding itself). Variable naming matters for code quality. Good names are precise, complete, and don't require a comment to understand: userAgeInYears is better than ua or age. AI-generated code often uses vague names (data, item, result, temp) that require reading the entire function to understand the variable's purpose. Descriptive names make code self-documenting. Scope (covered in its own entry) determines where a variable is accessible. Hoisting, destructuring, default values, and the temporal dead zone (TDZ — the period between when a let/const declaration is hoisted and when it's initialized) are all variable-related JavaScript mechanics worth knowing.

Code Example

// Variable declarations and the differences that matter

const PI = 3.14159;      // const: can't reassign
let count = 0;           // let: can reassign
count = count + 1;       // OK
// PI = 3;               // TypeError: Assignment to constant variable

// const with objects: binding is const, content is mutable
const user = { name: 'Alice', age: 30 };
user.age = 31;           // OK — mutating the object
// user = {};            // TypeError — can't reassign the binding

// Primitives vs references
let a = 42;
let b = a;   // b gets a COPY of the value
b = 100;
console.log(a); // 42 — unchanged

let obj1 = { x: 1 };
let obj2 = obj1; // obj2 gets a REFERENCE (pointer)
obj2.x = 99;
console.log(obj1.x); // 99 — same object in memory

// Destructuring with defaults
const { name = 'Anonymous', role = 'user' } = userData ?? {};

// Naming: descriptive beats terse
const d = u.dob;              // bad
const dateOfBirth = user.dateOfBirth; // good

Why It Matters for Engineers

The distinction between primitive values (copied by value) and object references (copied by reference) is one of the most common sources of subtle bugs in JavaScript. When AI generates code that assigns an array to a new variable and then "modifies the copy," it's actually modifying the original — a bug that only manifests at runtime with specific input. Understanding references vs values is foundational to writing correct JavaScript. Variable scoping bugs (using a variable before it's initialized, or assuming a variable is local when it's actually in an outer scope) are also frequent. Understanding const vs let vs var and their scoping rules helps you read and write code with fewer surprises.