Monday, 4 Aug 2025
  • My Interests
  • My Saves
  • Try Intents
Subscribe
Focus - Code Reveals
  • Home
  • HTML

    Difference between HTML Tag and HTML Element in HTML?

    By Chief Editor

    What is the difference between “HTML” and “HTML5”?

    By Chief Editor

    What are the different types of HTML tags?

    By Chief Editor

    What are the async and defer attributes in the “script” tag?

    By Chief Editor

    What is Doctype HTML in HTML?

    By Chief Editor
    What is Symentic HTML

    What is Symentic HTML?

    By Chief Editor
  • JavaScript

    What are the Rest and Spread operators in JavaScript?

    By Chief Editor

    Explain var let and const in JavaScript with Example.

    By Chief Editor

    Difference between document.createElement and document.createElementFragement in JavaScript?

    By Chief Editor

    What is a Promise in JavaScript, and what are its parameters?

    By Chief Editor

    What is memoization in JavaScript?

    By Chief Editor

    Explain Deep Copy and Shallow Copy in JavaScript.

    By Chief Editor
  • Frontend Interview

    How to Reverse a String in JavaScript: Two Essential Methods

    By Chief Editor

    Explain Deep Copy and Shallow Copy in JavaScript.

    By Chief Editor

    What is Block level Element and Inline Level Element?

    By Chief Editor

    Difference Between position: relative and position: absolute in CSS

    By Chief Editor

    What is Position in CSS?

    By Chief Editor

    What is Symentic HTML?

    By Chief Editor
  • Backend Interview

    What is the Event Loop in JavaScript?

    By Chief Editor

    How to Reverse a String in JavaScript: Two Essential Methods

    By Chief Editor

    What is middleware, and what is React Thunk?

    By Chief Editor

    What is Arrow and Normal Function in JavaScript?

    By Chief Editor

    What are the Lexical Scope in JavaScript?

    By Chief Editor

    What is a Promise in JavaScript, and what are its parameters?

    By Chief Editor
  • Nodejs
  • JavaScript Interview
  • React Interview
  • Frontend Interview
  • Backend Interview
  • Contact Us
  • Advertise with Us
  • Complaint
  • Cookies Policy
  • Privacy Policy
  • Donate
  • 🔥
  • ReactJS
  • JavaScript
  • JavaScript Interview
  • React Interview
  • HTML
  • Frontend Interview
  • CSS
  • Redux
  • Javascript
  • System Design
Font ResizerAa
Focus - Code RevealsFocus - Code Reveals
  • My Saves
  • My Interests
  • My Feed
  • History
  • Technology
Search
  • Homepage
  • ReactJS
  • JavaScript
  • JavaScript Interview
  • HTML
  • CSS
  • Backend Interview
Have an existing account? Sign In
Follow US
© 2022 Code Reveals Inc. All Rights Reserved.
Home Blog What is a Closure in JavaScript?
JavaScript

What is a Closure in JavaScript?

Chief Editor
Last updated: February 13, 2025 7:04 am
Chief Editor
Share
SHARE

A closure in JavaScript is a function that remembers the variables from its outer lexical scope even after the outer function has finished executing.

In other words:

  • A closure gives a function access to an outer function’s variables, even after the outer function has executed.
  • The function “closes over” the variables from its outer scope.

Key Characteristics of Closures:

  • Closures remember the environment in which they were created.
  • Closures can access variables from their outer scope even after the outer function is done executing.
  • Closures are created every time a function is created inside another function.

Example 1: Basic Closure Example

javascriptCopyEditfunction outer() {
    let count = 0; // Variable in outer scope

    function inner() {
        count++; // Accessing outer scope variable
        console.log(count);
    }

    return inner;
}

const counter = outer(); // outer() is executed, but its scope is preserved
counter(); // 1
counter(); // 2
counter(); // 3

Explanation:

  • outer() creates the variable count.
  • inner() is defined inside outer() and has access to count.
  • Even though outer() is done executing, the counter function still remembers count because of closure.
  • Each time counter() is called, it remembers the previous state of count.

Example 2: Closure with Parameters

javascriptCopyEditfunction multiplier(factor) {
    return function (number) {
        return number * factor;
    };
}

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

console.log(double(5)); // 10
console.log(triple(5)); // 15

Explanation:

  • multiplier() returns a function that multiplies by factor.
  • The returned function remembers factor due to closure, even after multiplier() has finished execution.

Why Are Closures Useful?

  • Data privacy: Variables in closures are not accessible from outside.
  • Stateful functions: Functions can remember state between calls.
  • Callbacks and Event Handlers: Closures are common in asynchronous programming and event handling.

Common Use Cases of Closures:

Use CaseExample
Data hiding/encapsulationCounter, private variables
Factory functionsGenerating customized functions
Callbacks and async functionsEvent listeners, setTimeout
Function curryingPartial application of functions

Key Takeaways:

  • A closure is a function + the environment in which it was created.
  • Closures allow functions to remember and access their outer scope variables even after the outer function has completed.
  • Used heavily in JavaScript patterns like module pattern, callbacks, and functional programming.
Share This Article
Email Copy Link Print
Previous Article What is hoisting in JavaScript with an example?
Next Article Explain Deep Copy and Shallow Copy in JavaScript.
Leave a Comment

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Your Trusted Source for Accurate and Timely Updates!

Our commitment to accuracy, impartiality, and delivering breaking news as it happens has earned us the trust of a vast audience. Stay ahead with real-time updates on the latest events, trends.
FacebookLike
XFollow
InstagramFollow
YoutubeSubscribe
LinkedInFollow
QuoraFollow
- Advertisement -
Ad imageAd image

Popular Posts

What is Doctype HTML in HTML?

The <!DOCTYPE html> declaration is used to define the document type and version of HTML…

By Chief Editor

What is one-way data binding in React?

One-way data binding in React means that data flows in a single direction, from the…

By Chief Editor

How can you delay the dispatch in React?

To delay a dispatch in React, especially when using something like Redux or React state…

By Chief Editor

You Might Also Like

JavaScriptJavaScript Interview

What is memoization in JavaScript?

By Chief Editor
JavaScript

What is hoisting in JavaScript with an example?

By Chief Editor
JavaScript

What is the Event Loop in JavaScript?

By Chief Editor
JavaScriptJavaScript Interview

What is Scope in JavaScript?

By Chief Editor

Focus by CodeReveals is your dedicated platform for mastering tech interviews and advancing your development skills. Whether you’re aiming to become a Frontend Developer, Backend Developer, or simply preparing for your next big interview, we’re here to guide you every step of the way.

Our mission is to help aspiring developers gain real-world knowledge, build confidence, and succeed in technical interviews. We offer structured content, curated interview questions, coding challenges, and practical guidance — all designed by experienced professionals who understand what top tech companies are looking for.

At Improve, we don’t just teach — we prepare you to think like a developer, solve like an engineer, and present like a pro.

Join us and start improving today — because your dream tech job is within reach

Most Famous
  • HTML
  • CSS
  • JavaScript
  • NodeJS
Top Categories
  • JavaScript Interview
  • React Interview
  • Frontend Interview
  • Backend Interview
Usefull Links
  • Contact Us
  • Advertise with Us
  • Complaint
  • Cookies Policy
  • Privacy Policy
  • Donate

©2025  Code Reveals Inc. All Rights Reserved.

Welcome Back!

Sign in to your account

Username or Email Address
Password

Lost your password?