JavaScript Closures

Written by Swapnil RajaPublished 24 Aug 2026

A JavaScript closure is a function that remembers the variables around it, even after the outer function has finished.

The inner function keeps a live link to the scope it was created in.

This is how a function can hold private state between calls.

Example

javascript

function makeCounter() {
  let count = 0;

  return function () {
    count++;
    return count;
  };
}

const counter = makeCounter();

console.log(counter());
console.log(counter());

PreviousJavaScript Temporal Dead Zone NextJavaScript this Keyword

Example

javascript

function createAccount(start) {
  let balance = start;

  return {
    deposit: function (amount) {
      balance += amount;
      return balance;
    },
    getBalance: function () {
      return balance;
    }
  };
}

const account = createAccount(100);

console.log(account.deposit(50));
console.log(account.getBalance());

Example

javascript

function multiplyBy(factor) {
  return function (n) {
    return n * factor;
  };
}

const double = multiplyBy(2);
const triple = multiplyBy(3);

console.log(double(5));
console.log(triple(5));

Example

javascript

function makeCounter() {
  let count = 0;
  return function () {
    count++;
    return count;
  };
}

const a = makeCounter();
const b = makeCounter();

console.log(a());
console.log(a());
console.log(b());

Example

javascript

function once(fn) {
  let called = false;
  let result;

  return function (...args) {
    if (!called) {
      called = true;
      result = fn(...args);
    }

    return result;
  };
}

const setup = once(() => "ready");

console.log(setup());
console.log(setup());

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript Closures</title>
</head>
<body>

  <h1>JavaScript Closures</h1>

  <p id="result"></p>

  <script>
    function makeCounter() {
      let count = 0;

      return function () {
        count++;
        return count;
      };
    }

    const counter = makeCounter();

    document.getElementById("result").innerHTML =
      counter() + ", " + counter() + ", " + counter();
  </script>

</body>
</html>

JavaScript Closures

Example

What is a Closure?

Syntax

Private Data

Example

Function Factories

Example

Each Call Gets Its Own Scope

Example

Closures in Loops

Example

Closures Hold Memory

Example

Complete Example

Try It Yourself

Important Points

Conclusion