4 ms·
Ask HN: Have You Ever Found an Explicit Use for JavaScript Closures?
"Frankly, you can’t get very far with JavaScript without learning about closures."
"If you can’t answer this question, you’re a junior developer. I don’t care how long you’ve been coding."
https://medium.com/javascript-scene/master-the-javascript-interview-what-is-a-closure-b2f0d2152b36
Ever since reading this dramatic (and, in retrospect, idiotic) statement, I have been kind of obsessed with figuring out the actual use for closures. I will grant the "mimic private field/property" and the module pattern. Past that though, any intentional use of closures seem limited to "if I loop through a set of dom elements and assign an event, the event will be assigned incorrectly", e.g.
var buttons = document.getElementsByTagName("button");
for (var i = 0; i < buttons.length; i++) {
buttons[i].addEventListener("click", function() {
console.log("My value: " + i);
});
}
// Each button will state "My value is 3" (Instead of 1,2,3)
So, after reading chapters in three books and a ton of articles and stackoverflow posts, I ask you HN - have you ever used a closure intentionally? If so, please share.
- eschutte2 8y agoConstantly - it's so important that it's just kind of in the background of everything I do. Doesn't it make currying and point-free style much easier?
- madeuptempacct 8y agobut why? From first google search result (https://hackernoon.com/currying-in-js-d9ddc64f162e https://hackernoon.com/currying-in-js-d9ddc64f162e): function sum3(x) { return (y) => { return (z) => { return x + y + z; }; }; } console.log(sum3(1)(2)(3)) // 6 How is this cleaner than? sum(1,2,3); I have seen examples like this before, but I don't understand the point of this either. I guess I will read up on currying more, thank you.
- eschutte2 8y agoSorry, just got back and saw your reply. This is too big a topic to go into here and there's already plenty written on it. Sum is not a realistic use case. If you're doing Javascript, maybe look at lodash/fp for ways people really use currying. I think my answer to "why" would be: if your mind is already geared to think about problems in terms of composition of functions, then currying (for example) is just one necessary and natural thing that falls out of that.
- madeuptempacct 8y agoI appreciate you getting back to me!
- rl3 8y agoWhile there's many legitimate and peculiar use cases where closures make sense when writing properly engineered code, my favorite use is simply abusing them in one-off or ad-hoc code where performance or correctness isn't a concern. Basically just using them as lazy shortcuts to avoid the hassle of argument passing. It's particularly great when you have a function scope that's three or four levels deep, and you're referencing a variable via closure that's in the top-level function scope. Much less work.
- arenaninja 8y agoI write a LOT of React code, and I abuse closures daily The statement you quote is overly dramatic, and it takes maybe 5 minutes to clearly explain the concept to someone that grasps the basic language syntax. The usefulness is more difficult to lay out clearly Where it comes up very often for me is when using mapStateToPropsFactory from react-redux, like this: // a closure for ownProps is created // the factory is not invoked everytime the component changes props const mapStateToPropsFactory = (_, ownProps) => { const { uniqueId } = ownProps; return function mapStateToProps(state) { return { usefulThing: state.usefulThings[uniqueId], ping: state.pong, } } } If you don't do things this way, react-redux loses a lot of optimizations for connected components that have an ownProps argument