DEV Community

Cover image for Closures in JavaScript - the Simplest Explanation

Closures in JavaScript - the Simplest Explanation

Sam on January 23, 2023

Closures in JavaScript are like secret passageways for a function to remember certain variables, even after it's done running. In this article, I'l...
Collapse
 
the_yamiteru profile image
Yamiteru •

At first I though this article is gonna be a disaster (plainly based on my experience with such articles). But I've been delightfully proven wrong. It's a very nice introduction for beginners.

Good job!

Collapse
 
mohsenkamrani profile image
Sam •

I'm happy I didn't disappoint you.
Thanks!

Collapse
 
mohsenkamrani profile image
Sam •

I'm glad you find it helpful.

Collapse
 
jonrandy profile image
Jon Randy ๐ŸŽ–๏ธ • • Edited

Not really quite correct. A closure is the combination of a function and the scope in which it was defined. I think that's probably about the simplest way to put it.

Collapse
 
mohsenkamrani profile image
Sam •

Not sure which part is not correct.

Also, I didn't provide any definition against this (function and its lexical environment), indeed I didn't even talk about the definition.
I just wanted to show the concept with two of the most common use cases by example. Sometimes I find the definition more confusing than just seeing the concept in action.

Collapse
 
jonrandy profile image
Jon Randy ๐ŸŽ–๏ธ • • Edited

The inner function is a closure...

The function on its own is not a closure.

...the returned object and its methods are closures...

Objects are definitely not closures, and methods are functions; which are only part of a closure.

Thread Thread
 
mohsenkamrani profile image
Sam •

Not right. Take a look at MDN and this section in particular:
"...add5 and add10 are both closures."

This is idiomatic enough for me and I'm fine with it and I guess MDN is too.

Thread Thread
 
jonrandy profile image
Jon Randy ๐ŸŽ–๏ธ • • Edited

Very first sentence on MDN page:

A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment).

They seem to get a little loose with the wording further on. Semantics really, but I think it's an important thing to help avoid confusion when talking about closures and functions. Regardless, saying an object is a closure is definitely not correct.

Overall, probably better to say that a function 'forms' a closure rather than 'is' a closure - keeps the distinction.

Thread Thread
 
jonrandy profile image
Jon Randy ๐ŸŽ–๏ธ • • Edited

Looking more at the MDN page, they mostly say 'form' instead of 'is' - I've made a PR via GitHub with a few tweaks to the page. MDN is a superb resource - mostly because it's community maintained like Wikipedia.

Collapse
 
wrench1815 profile image
Hardeep Kumar •

Finally, after more than a year. I understood properly what the heck closure. Thanks a lot.

Collapse
 
mohsenkamrani profile image
Sam •

I'm glad you find this helpful.

Collapse
 
nourhan51964568 profile image
NourhanAhmed •

very simple and to the point thank you

Collapse
 
mohsenkamrani profile image
Sam •

Thanks for your feedback.