Closures are one of the most powerful features of JavaScript, but they can be confusing at first. Simply put, a closure gives you access to an outer function’s scope from an inner function, even after the outer function has finished executing.
In this blog, we’ll break down closures with easy-to-understand examples so you can start using them confidently.
🧠 What is a Closure?
A closure is created when a function is defined inside another function, and the inner function remembers the variables of the outer function even after the outer function returns.
🔍 Example 1: Basic Closure
javascriptCopyEditfunction outer() {
let count = 0;
function inner() {
count++;
console.log(count);
}
return inner;
}
const counter = outer();
counter(); // 1
counter(); // 2
counter(); // 3
Here, inner has access to count even after outer has finished, preserving the state between calls.
🔍 Example 2: Using Closure for Data Privacy
Closures can be used to create private variables:
javascriptCopyEditfunction secret() {
let privateData = "hidden";
return {
getSecret: function() {
return privateData;
},
setSecret: function(newSecret) {
privateData = newSecret;
}
};
}
const mySecret = secret();
console.log(mySecret.getSecret()); // hidden
mySecret.setSecret("new secret");
console.log(mySecret.getSecret()); // new secret
🧰 Why Use Closures?
- Data encapsulation: Hide variables from the global scope.
- Maintain state: Useful for counters, caches, or event handlers.
- Functional programming: Pass functions with preserved environments.
⚠️ Things to Remember
- Closures can cause memory leaks if not used carefully (because variables stay in memory).
- Understand the scope chain to avoid confusion with variable shadowing.
Conclusion:
Closures are essential to mastering JavaScript. They enable powerful patterns like data privacy and function factories. Practice with closures to unlock more advanced programming techniques.
🚀 Pro Tip: Try creating a simple counter using closures to get hands-on experience!