Click here to Skip to main content
Click here to Skip to main content
Technical Blog

Tagged as

JavaScript Anonymous Functions

, 10 Jun 2011 CPOL
Rate this:
Please Sign up or sign in to vote.
Some of the pro's and con's of using anonymous functions in JavaScript.

Up until now I have found the term “anonymous” pretty confusing in the context of JavaScript.   In this post I’ll explain how to define anonymous functions, what “anonymous” means, and what uses these functions have.

The ECMAScript specification does not have any mention of the term anonymous, so in a sense it is open to interpretation.   However, there is a clear consensus from the JavaScript community on the following definition (Crockford, Mozilla, Chrome debugger, Firebug):

“An anonymous function is a function without a name.”

This may seem obvious but it could be confused with the more general definition of anonymous functions which would say that a function is anonymous when it has no identifier, which could be a variable.  For example, consider the following ways of declaring a function:

	//Example 1
	function bob() {
		...
	}
	bob();
 
	//Example 2
	var bob = function(){
		...
	};
	bob();

Example 1 creates a function with name “bob”.  Additionally, a variable named “bob” is created in the current scope and is assigned to the function.

Example 2 declares an unnamed function and assigns it to a new variable named “bob”.

We can see that these two ways of defining a function are essentially the same – both result in a function being created, and a new variable named “bob” assigned to the current scope. However, the second function is anonymous.

In this next example, a function is given both a name “anna” and is explicitly assigned to a variable “bob”:

	var bob = function anna(){
		...
	};
	bob();
	anna(); //Exception: 'anna' is not defined

When we use this format, the function name is not used to create a variable since the variable “bob” is created instead.  However, the function has its name property set to “anna”.

Now, what is the significance of this “name” property?  And why are named functions better than anonymous functions?  Why use anonymous functions at all?  Here is all of the pro’s and con’s I can think of:

Named

Anonymous

Debugging: we see the name of functions in the stack trace. If all we’re seeing is “anonymous” up and down the stack, that’s not too useful. Scope: when creating a fake “block” scope using an immediately executing function, we don’t really need a name.
Recursion: a function can call itself when it has a name. If it’s only assigned to a variable, then that variable is outside the function’s scope. Brevity: if it’s a very short function or callback, or an immediately-executing function, it’s nice to keep the function declaration short by omitting a name.

As an aside, the above link to the Mozilla Developer Network mentions the term “named anonymous functions”.  I think this is a bit of an unfortunate, paradoxical term and shouldn’t be used, since if a function is named then it clearly isn’t anonymous:

	var result = (function bob(){
		...
	}());

Instead of labelling this piece of code with the term “named anonymous function” it would probably be more useful to understand that the function isn’t kept in scope after it is executed.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Jonathan Cardy
Software Developer Repstor Ltd
United Kingdom United Kingdom
I am a Software Developer at Repstor.

Repstor’s products enable the successful adoption of content management systems within organizations. Repstor affinity provides uninterrupted access to content systems, like SharePoint through the familiar interface of Microsoft Outlook. Repstor assist provides facilitated filing for all users by suggesting the most suitable location for new content based on best practice filing.
Follow on   Twitter

Comments and Discussions

 
-- There are no messages in this forum --
| Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.1411023.1 | Last Updated 10 Jun 2011
Article Copyright 2011 by Jonathan Cardy
Everything else Copyright © CodeProject, 1999-2014
Layout: fixed | fluid