Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Javascript Anonymous Closure

I have read a lot about closures in Javascript What are those braces for?? I read on mozilla.org which says closure should be defined as

(function(){...})();

but on http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html, it says the closure function is

(function(){...}());

What's the difference or the latter one is wrong? what's the purpose of the last ()? Would you put some parameters inside? I am looking for a good reference.

Edit: Moreover, there is an example on Mozilla.org

var makeCounter = function() {
var privateCounter = 0;
  function changeBy(val) {
    privateCounter += val;
  }
  return {
    increment: function() {
      changeBy(1);
    },
    decrement: function() {
      changeBy(-1);
    },
    value: function() {
      return privateCounter;
    }
  }  
};

why the semicolon is needed for this 'function'? If it needs to be invoked immediately after its declaration, a () should be put before the ending semicolon. But there is not.

like image 755
Trio Cheung Avatar asked Apr 16 '13 09:04

Trio Cheung


People also ask

Is an anonymous function a closure?

Anonymous functions, also known as closures , allow the creation of functions which have no specified name. They are most useful as the value of callable parameters, but they have many other uses. Anonymous functions are implemented using the Closure class.

What is JavaScript anonymous function?

Anonymous Function is a function that does not have any name associated with it. Normally we use the function keyword before the function name to define a function in JavaScript, however, in anonymous functions in JavaScript, we use only the function keyword without the function name.

What is a JavaScript closure?

A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function's scope from an inner function.

Can anonymous function return JavaScript?

No, you cannot return a value from an asynchronous callback. Event callback will be called on click, but you can't assign its result.


1 Answers

The syntax

(function(){...})()

is simply an immediately invoked anonymous function. It does not matter how you use your brackets, as the underlying code is a function being declared, and invoked.

Closures are instead used to describe a situation where a function has access to variables declared outside of its scope, accessible via closures

For clarity :

If we have the following function

   function hello() {
      alert("Hello");
   }

We can call the function with the following

hello()

Which invokes the function 'hello'. But if we do not wish to give it a name, but still invoke it, then we can do

(function hello() {
   alert("Hello");
})()

Which will do the exact same as the previous example of calling hello

However, in this scenario there is no point in giving the function the name 'hello', so we can simply remove it:

(function() {
    alert("Hello");
})()

Which is the notation used in your original question.

like image 68
AlanFoster Avatar answered Oct 12 '22 23:10

AlanFoster