1. Technology

Your suggestion is on its way!

An email with a link to:

http://javascript.about.com/library/blfunc.htm

was emailed to:

Thanks for sharing About.com with others!

Alternative Ways to Define Functions

Join the Discussion

Questions? Comments?

There is often more than one way to do the same thing when you are writing programs. Javascript provides not just one way to define functions but instead provides three completely different ways to do it. The most common way of defining a function is to define the name of the function first followed by the actual definition of the function like this (using two arguments as an example, there can of course be any number):

function myFunctionName(arg1,arg2) {
// function content goes here
}

The second way of defining a function allow you to define the function without having to give the function a name. By making the function anonymous (by not giving it a name) we reduce the chance of the function clashing with another function elsewhere in the page. Of course the other aspect of not giving the function a name means that we can't call the function in the conventional way either but if we are attaching a function to an event handler (for example) and don't need to call the function from anywhere else then using this alternative method can actually simplify our code. For example to attach a conventionally defined function such as the above example to the onload event we would first code the function as above and then add the following statement to attach it.

window.onload = myFunctionName;

Note that we do not specify the () when we do this as that would result in the function being run straight away and the returned value being attached to the event handler instead of the function itself.

To define an anonymous function for use with an event handler we combine the function definition with the event handler assignment like this:

window.onload = function() {
// function content goes here
};

You can of course use anonymous function declarations like this anywhere in your code where you want to attach some code that does not need to be run from anywhere else.

The third way of defining functions in Javascript shows how Javascript actually treats functions as just another type of object (which is rather different from the way most other languages treat functions). We can actually define a function and assign it to a variable using code very similar to that used to define any Javascript object like this (again using two arguments as an example):

var myFunctionName = new Function(arg1, arg2,
"/* function content goes here */");

As you can see this way of defining a function looks very similar to the long way that you would use to define an object, array, or regular expression and the only way of defining other objects such as dates. There are two differences between a function defined this way and one defined the conventional way. Firstly the function content is passed as a literal in the last parameter to the call and is evaluated (the same as if it were in an eval statement) every time the statement is called. The second difference is that all of the variables defined within this type of function definition are not restricted in scope to the function itself.

Each of the three ways of defining functions can be substituted for either of the other two provided that it is coded appropriately. Each however has situations where it can provide shorter and more maintainable code than where either of the others is used and so a knowledge of all three ways of defining a function allows you to define your functions in the way that best suits the particular circumstances that apply to whatever your Javascript is intended to do.

©2014 About.com. All rights reserved.