Closures are one of the most powerful features of JavaScript, but they can also be a source of confusion for many developers. In a nutshell, a closure is a function that remembers values in the enclosing scope, even after the parent function has closed.
This allows us to create functions that have a private scope, and to maintain state and encapsulation in our code. Closures have some pretty neat use cases such as implementing private variables and methods, event handling, async operations. They're also fundamental to functional programming, used for implementing higher-order functions, currying and can also be used for performance optimization techniques such as memoization.
Creating OOP with closures:
function createPerson(name, age) {
let person = { name, age };
return {
getName: function() {
return person.name;
},
getAge: function() {
return person.age;
},
setName: function(newName) {
person.name = newName;
},
setAge: function(newAge) {
person.age = newAge;
}
};
}
const person = createPerson("John Doe", 30);
console.log(person.getName()); // John Doe
console.log(person.getAge()); // 30
person.setName("Jane Doe");
person.setAge(32);
console.log(person.getName()); // Jane Doe
console.log(person.getAge()); // 32
In this example, we use a closure to create a createPerson function that returns an object with private state (the person object) and public methods for accessing and modifying that state (getName, getAge, setName, and setAge). This allows us to create objects with a defined interface and private state, just like in traditional OOP.
Closures provide a powerful and flexible way to implement many things in JavaScript, and they are widely used in many libraries and frameworks. If you're not already familiar with closures, I highly recommend taking the time to learn and understand this important concept. 💡
Top comments (9)
This isn't correct - if it were, then there would be no point having the separate words 'closure' and 'function', since ALL functions remember values in the scope in which they were created.
From MDN (empasis mine):
It's a subtle difference in meaning, but closure ≠ function.
Its not correct taken out of the entire text lol
“In a nutshell, a closure is a function that remembers values in the enclosing scope even if they are not present in memory.”
Yeah, it's tricky to word... but wording it like that essentially makes it seem like either: closures and functions are the same thing, or that a closure is a special kind of function - neither of which is true. These are confusions that I see a lot from interview candidates and junior devs. I think it's important to try to be clear.
Also, if the variables can be 'remembered', then they are still present in memory - your function isn't psychic! 🙂
Yes, that made no sense lol. I’ll fix it.
But still, closures are functions, but that doesn’t imply that functions and closures are the same, or that all functions are closures. By w3 definition:
A closure is a function having access to the parent scope, even after the parent function has closed.
A function and a closure are two different things.
Wikipedia:
Great article, you got my follow, keep writing!
Your explanation sounds somehow confusing when you say a closure is a function. It is a function object that remembers their surrounding state, even if you invoke them outside their scope.
Also, might be me, but saying closures are OOP is not that correct. It can be used in an OOP context, yes, but not a concept of OOP. They are a key concept of functional programming. It’s worth checking this out:
And another example:
Here, what’s happening is that the
greetfunction takes agreetingargument and returns an anonymous function which takesnameas an argument. The returned anonymous function logs a string ofgreetingandnamearguments combined.But closures are not OOP, they can be used to implement OOP and features like private methods and variables. Which weren’t a possibility in class until very recently.
And a closure is a function, but not all functions are closures. By w3 definition:
A closure is a function having access to the parent scope, even after the parent function has closed.