Variables in JavaScript

Introduction

Variables are named containers for values your program uses and changes over time. This chapter covers const, let, and legacy var, how assignment works, and naming habits that keep code readable. Solid variable skills make every later topic—strings, objects, and APIs—much easier.

Prerequisites

Declaring Variables: const and let

Modern JavaScript uses const (default) and let (when reassignment is needed).

javascript
// const: bind once; do not reassign the variable
const appName = "learn-all";
 
// let: allow reassignment
let score = 0;
score = 10;
 
console.log(appName, score);

Tip

Best Practice

Start with const. Switch to let only when you must reassign. Avoid var in new learning projects.

Assignment and Reassignment

Declaration creates the binding; assignment stores a value:

javascript
// Declare then update with let
let status = "pending";
status = "shipped";
console.log(status);
 
// const cannot be reassigned
const maxItems = 100;
// maxItems = 200; // TypeError in strict mode

const still allows mutating objects and arrays—the binding stays the same, inner data can change:

javascript
// const object: reference fixed, properties can change
const user = { name: "Ada", role: "editor" };
user.role = "admin";
console.log(user.role);

var (Legacy, Know It Exists)

var is function-scoped and hoisted differently—common in old tutorials and codebases.

javascript
// var behaves differently in blocks (avoid in new code)
for (var i = 0; i < 3; i++) {
  // ...
}
// console.log(i); // may print 3 — surprising to beginners

Prefer let/const unless you maintain legacy files.

Variable Naming Recap

  • camelCase for variables: orderTotal, isActive
  • Meaningful names over x, tmp
  • Do not use reserved words as names

Uninitialized and undefined

Declared bindings without assignment hold undefined:

javascript
// let without initializer
let pendingId;
console.log(pendingId);

Constants That Are Truly Fixed

Use const for values that should not be rebound. For deep immutability, advanced patterns exist (Object.freeze)—introduced later with objects.

javascript
// Freeze shallow object (preview of object chapter)
const config = Object.freeze({ theme: "dark", lang: "en" });
// config.theme = "light"; // fails silently or throws in strict mode
console.log(config.theme);

Mini Example: Cart Counter

javascript
// Simple cart counter using let and const
const productName = "Sticker pack";
const price = 4.5;
let quantity = 1;
 
quantity = quantity + 2;
 
const subtotal = price * quantity;
console.log(`${productName} x ${quantity} = $${subtotal}`);

FAQ

Should I always use const?

Use const unless you need reassignment. It signals intent and prevents accidental overwrites.

Can I change a const array?

Yes—you can push and pop. You cannot assign a new array to the same variable name.

What is hoisting?

JavaScript moves some declarations before execution in surprising ways—especially var and function. You will meet hoisting again with functions; stick to let/const to reduce confusion.

Is let score = score + 1 valid?

The right-hand side uses the old value before assignment. It is valid and common.

What comes next?

Data types explains primitives, typeof, and how values behave.