Difference Between let and var in JavaScript Explained

In JavaScript, both let and var are used to declare variables — but they behave very differently. Understanding the difference between them is essential for writing cleaner, bug-free code. This guide explains the key differences between let and var in terms of scope, hoisting, global behavior, and redeclaration, along with examples showing when you should use let instead of var.

coldshadow44 on 2025-10-14

Report

Make a comment

Showing comments related to this post.

_

2025-10-14

1. Scope Differences (Block Scope vs Function Scope)

The biggest difference between let and var lies in variable scope.

var is function-scoped — it is visible throughout the entire function in which it’s declared.
let is block-scoped — it only exists within the nearest pair of curly braces { }, such as inside a loop, conditional, or function block.

Example:

function run() {

var foo = "Foo";

let bar = "Bar";

console.log(foo, bar); // Foo Bar

{

var moo = "Mooo";

let baz = "Bazz";

console.log(moo, baz); // Mooo Bazz

}

console.log(moo); // Mooo

console.log(baz); // ReferenceError: baz is not defined

}

run();

Here, moo (declared with var) is accessible outside its block, while baz (declared with let) is not.

2. Hoisting Behavior

Both var and let are hoisted, but they behave differently:

var variables are hoisted and initialized to undefined. You can access them before declaration, though their value will be undefined.
let variables are hoisted but not initialized. Accessing them before declaration results in a ReferenceError — this period is called the Temporal Dead Zone (TDZ).

Example with var:

function checkHoisting() {

console.log(foo); // undefined

var foo = "Foo";

console.log(foo); // Foo

}

checkHoisting();

Example with let:

function checkHoisting() {

console.log(foo); // ReferenceError

let foo = "Foo";

console.log(foo); // Foo

}

checkHoisting();

3. Global Object Property

At the global level, variables declared with var become properties of the global object (window in browsers), while variables declared with let do not.

var foo = "Foo"; // global scope

let bar = "Bar"; // global but not attached to window

console.log(window.foo); // Foo

console.log(window.bar); // undefined

This makes let safer to use in modern JavaScript because it avoids accidental overwriting of global variables.

4. Redeclaration

Redeclaring a var variable in the same scope is allowed, but redeclaring a let variable causes a SyntaxError.

'use strict';

var foo = "foo1";

var foo = "foo2"; // OK, replaces the previous value

let bar = "bar1";

let bar = "bar2"; // SyntaxError: Identifier 'bar' has already been declared

5. When to Use let Instead of var

You should always prefer let (or const) over var in modern JavaScript because:

It prevents accidental overwriting of variables.
It limits variable visibility to its block, reducing bugs.
It works predictably with loops and asynchronous functions.

Example of a common bug fixed by using let:

for (let i = 0; i < 3; i++) {

setTimeout(() => console.log(i), 1000);

}

// Logs: 0, 1, 2

If you used var, all logs would show 3 because var doesn’t create a new scope per loop iteration.

Conclusion

Use let whenever you need a variable that can be reassigned but should stay within its block. Avoid var in modern code unless you are maintaining older JavaScript that depends on it. The introduction of let in ES6 made variable handling more predictable and safer for developers.

Ask. Code. Learn. Grow with the Developer Community.

Difference Between let and var in JavaScript Explained

Showing comments related to this post.

_

Member's Sites: