What is the difference between these two ways to define a function in JavaScript?

Question

Possible duplicate:
Javascript: var functionName = function () {} vs function functionName () {}

Method 1:

function fancy_function(){ // Fancy stuff happening here } 

Method 2:

 var fancy_function = function(){ // Fancy stuff happening here, too. } 

I use the first when I simply define a “normal” function that I am going to use one or more times, and the second when I pass it a callback to another function or so, but it works fine in both directions.

Is this really any difference?

Answer 1

There is no difference with the function itself, but the latter gives you great flexibility, since you have a link to the function, and it is different from how it behaves if it is overwritten.

This allows you to achieve behavior with the latter, which you cannot achieve with the former; such as the following trick to "override" an existing function and then call the "base":

 var myOriginalFunction = function() { window.alert("original"); } var original = myOriginalFunction; var myOriginalFunction = function() { window.alert("overridden"); original(); } myOriginalFunction(); 

This gives you the warning "overridden", followed by the warning "original".

However, if you try to do this with the previous entry, you will find that you are stuck in an endless "overidden" warning loop.

Answer 2

• function definition
• Literal function

The only difference is that you can access the former instantly in certain cases, while you have to wait for the destination at the latter.

Do not run this in firebug console / interpreter to test it, rather check on the real html page.

 say('spotted'); function say(msg){ alert(msg) } 

The above will work, but if you defined a function literal with var say = function(){} below, it will complain that it is not defined yet.

Answer 3

In the first example, you define a named function — this function will always be known by that name. An error defining another function with the same name will be an error (unless you directly assign a window property). In the second example, you define an anonymous function and assign it as the value of a variable. You can change the value of a variable to any other function later at will; losing, of course, any link to an anonymous function in the process, unless you saved it elsewhere. Thus, you do not do the same in both cases, although you can do what you want and be sure to define a function before it is used in the second case, although it is more a function of variables than functions as such.

Answer 4

You can use it either depending on the situation, or become methods of the window object. Later known as an anonymous function.

Answer 5

As for the function, they will behave the same.

See here http://javascript.about.com/library/blfunc.htm for details

Answer 6

Functions defined by the Function(){} style are available throughout the program, without the need to define earlier in the code than where they are called. I believe this is called a "climb."

therefore it works

 cow('spotted'); function cow(color){ return 'cow is '+color; } 

but it causes an error

 cow('spotted');//cow isn't defined yet! var cow=function(color){ return 'cow is '+color; }