Lesson 2: Variables – var, let, and const

Learning Objectives

By the end of this lesson, learners will:

  • Understand what variables are and why they’re used
  • Know how to declare variables using var, let, and const
  • Learn the differences between the three
  • Understand the concepts of scope and reassignment
  • Learn best practices for declaring variables

What Is a Variable?

A variable is a container that holds a value so you can use it or change it later in your program.

Think of it like a labeled box:
You write the label (userName), and you put something inside (like "Alice").


Declaring a Variable in JavaScript

There are three keywords to declare a variable in modern JavaScript:

KeywordCan Reassign?ScopeDescription
var✅ YesFunctionOld way (not recommended)
let✅ YesBlockRecommended for variables that change
const❌ NoBlockRecommended for variables that don’t change

Using let (Modern and Recommended)

let age = 25;
console.log(age); // 25

age = 26;
console.log(age); // 26
  • You can reassign the value of a let variable.
  • It is block-scoped, meaning it only works within the { } block it’s defined in.

Using const (For Fixed Values)

const birthYear = 2000;
console.log(birthYear); // 2000

// birthYear = 2001; ❌ This would cause an error!
  • const variables cannot be reassigned.
  • Great for values that should never change, like configuration settings or constants.

Using var (Old and Avoided)

var name = "Alice";
console.log(name); // Alice

var name = "Bob";
console.log(name); // Bob
  • You can redeclare var variables — this can lead to bugs.
  • It is function-scoped, not block-scoped.

Best practice: Avoid var in modern JavaScript.


Examples of Variable Declarations

let city = "Berlin";          // string
const pi = 3.14159;           // number
let isStudent = true;         // boolean
let temperature;              // undefined

Variables must be declared before use

console.log(message); // ❌ ReferenceError
let message = "Hello!";

JavaScript reads top-down, so declare your variables before you try to use them.


Variable Naming Rules

  1. Must start with a letter, underscore _, or dollar sign $
  2. Can contain letters, numbers, _, and $
  3. Cannot start with a number
  4. Cannot be a reserved keyword (like let, return, function, etc.)

✅ Valid:

let userName;
let $price;
let _totalAmount;

❌ Invalid:

let 1stPlace;    // Cannot start with number
let let = 10;    // Cannot use reserved keyword

Scope: Where Variables Live

  • Block scope: Inside {} — used by let and const
  • Function scope: Entire function body — used by var
{
  let x = 10;
  console.log(x); // 10
}
console.log(x); // ❌ Error: x is not defined

Best Practices

PracticeReason
Use let for changing valuesIt’s flexible and safe
Use const for fixed valuesPrevents accidental changes
Avoid varCan lead to bugs due to scoping issues
Name variables clearlyImproves readability and maintainability
Use camelCasee.g., userAge, totalPrice

Practice Exercise

Try this in your browser console:

let user = "Alice";
const year = 2025;

console.log(user); // Alice
user = "Bob";
console.log(user); // Bob

// year = 2030; ❌ Error: Assignment to constant variable

Summary Table

Featurevarletconst
Reassignable?✅ Yes✅ Yes❌ No
Redeclarable?✅ Yes❌ No❌ No
ScopeFunctionBlockBlock
Use CaseLegacy code onlyChanging valuesFixed values