0

What is the difference between a closure and an anonymous function in JavaScript

Matt Lo
  • 5,442
  • 1
  • 21
  • 21
  • 1
    With respect to closures, a function is a function in JavaScript. Doesn't matter if it's anonymous. –  Jan 23 '12 at 04:37
  • well said, as in your other posts too. I'm looking for a hardline approach though (like some of your earlier responses) but more on definition of closures in contrast to how the term is used in JavaScript and with the term "anonymous functions." Is it safe to say both terms are interchangeable with each other in JavaScript? – Matt Lo Jan 23 '12 at 04:47
  • 1
    Imagine two functions. Doesn't matter if they're anonymous or not, but one function is inside the other. Now lets say that the outer function has a variable `foo`. Even though `foo` is inside the outer function, but not the inner function, the inner function can still access `foo`. This is because the inner func creates a "closure" over the variable environment of the outer. So a "closure" is this phenomenon of nested variable environments being able to access the variables of the environments that contain it. –  Jan 23 '12 at 04:58
  • 1
    @MattLo - if you want a hardline approach, comparing closures to anonymous functions is comparing apples to oranges. The terms are _not_ equivalent, but some people use them interchangeably because they don't know the difference. – nnnnnn Jan 23 '12 at 05:14
  • 1
    @amnotiam - Even languages that don't have closures support what you've described: that is just "normal" nested function scope. Where the closure concept comes in is when the inner function is executed _after the outer function has returned_, something that isn't even possible in some languages. (I'm confident you _know_ that, but you didn't _say_ it.) – nnnnnn Jan 23 '12 at 05:19
  • @nnnnnn: I disagree that the inner function has to be executed later for it to be a closure. A function is a lexical environment that has a reference to its enclosing lexical environment, and therefore its variables. This is a closure. We often use the inner function after the outer has returned, and can enjoy the benefit of the closure at that time, but the closure exists either way. It's just short-lived if we don't export the inner function. –  Jan 23 '12 at 15:52
  • @amnotiam - I didn't mean that it wasn't a closure either way. I just meant that unless you export the inner function in some way the closure concept is not particularly relevant. Plenty of languages that don't have closures allow nested functions, so an explanation of closures should mention what extra benefits they provide beyond simple nesting. – nnnnnn Jan 23 '12 at 20:51
  • @nnnnnn: I see what you mean. Yes, you're right. You don't have closures without first-class functions that can be exported while retaining their enclosing environment, and the existence of a closure itself isn't particularly useful until you take particular advantage of it. Sort of like car insurance. :) –  Jan 23 '12 at 21:02

3 Answers3

4

The closure mechanism applies to all JavaScript functions, whether anonymous or not.

I think confusion between the two concepts comes from use of the term "closure" where an author has said something like "the following code creates a closure" and then given an example that happens to use an anonymous function. In such instances typically the closure mechanism is what is important to make the particular piece of code work as intended, while use of an anonymous function rather than a named function just happens to be a convenient way to code it. People reading such examples and seeing "closure" for the first time then misinterpret the term and go on to use it incorrectly in their own Stack Overflow or blog posts and so the confusion spreads.

nnnnnn
  • 147,572
  • 30
  • 200
  • 241
  • Late reply but I wanted a long period of time to get input (from SO and from my co-workers). In terms of JavaScript, a closure is a form of encapsulation (nothing new). The goal of my question was a callout on Closures (and the best way to do it is to contrast it to anonym). Your composure for this issue is on key and to my perception (and should be fact) **closures in JavaScript is a concept that can be applied by using any function expressed in JavaScript.** Your input made me approach this at a higher level and further analyzing instances of a closure in JS with other languages. Thank you. – Matt Lo Feb 03 '12 at 05:07
1

A closure is an expression relying on a namespace reference in which variables are resolved (a context). An anonymous function is one way to form a closure in Javascript - a named function is another.

There is some discussion about the ability to form closures with non-function blocks, but the current standards specify no such.

http://jibbering.com/faq/notes/closures/ is a pretty good description.

Borealid
  • 95,191
  • 9
  • 106
  • 122
  • It is not true - closures at block levels are possible. An example is `let` introduced in JavaScript 1.7 ([see more here](https://developer.mozilla.org/en/New_in_JavaScript_1.7#Block_scope_with_let_(Merge_into_let_Statement))). From the documentation: "_The let statement provides a way to associate values with variables within the scope of a block, without affecting the values of like-named variables outside the block._". – Tadeck Jan 23 '12 at 04:38
  • @Tadeck: I'm sure @Borealid is talking about JavaScript in the sense of the official ECMAScript standard. `let` is not part of that standard. –  Jan 23 '12 at 04:42
  • @amnotiam: correct. I'm sure at least one of the two different block-scoping constructs will make it into ECMAScript at some point, but that hasn't happened yet. – Borealid Jan 23 '12 at 04:51
1

A closure is a function that has captured its environment (the variables that it has access to)

It can be created both from an anonymous and as from named function.

And an anonymous function differs from a named function mainly that it's declaration does not get hoisted to top of the scope.

wizzard0
  • 1,883
  • 1
  • 15
  • 38