As seen here, there are some differences between function declaration and function expression.

A function expression has one disadvantage vs a function declaration, if called before its been declared it will give an error.

I would like to know only the advantages to use a function expression as I only seem to see the disadvantage I just named above. I possible with an example...

function expression:

alert(foo()); // ERROR! foo wasn't loaded yet
var foo = function() { return 5; } 

function declaration:

alert(foo()); // Alerts 5. Declarations are loaded before any code can run.
function foo() { return 5; } 

As seen here, there are some differences between function declaration and function expression.

A function expression has one disadvantage vs a function declaration, if called before its been declared it will give an error.

I would like to know only the advantages to use a function expression as I only seem to see the disadvantage I just named above. I possible with an example...

function expression:

alert(foo()); // ERROR! foo wasn't loaded yet
var foo = function() { return 5; } 

function declaration:

alert(foo()); // Alerts 5. Declarations are loaded before any code can run.
function foo() { return 5; } 

• javascript
• function

• possible duplicate of var functionName = function() {} vs function functionName() {} – David Thomas Commented Apr 11, 2014 at 12:34
• That's to do with "hoisting". For function declarations the whole function is hoisted. For function expressions only the variable is hoisted. – Andy Commented Apr 11, 2014 at 12:36
• The point is, the question is not well formulated. It is more like a view out of the box. The advantages are the disadvantages (at the same time) in different situations. So the question should be, which are the situations for... – perhelion Commented Feb 8, 2020 at 19:45

3 Answers 3

Along with that very good answer, the only advantage I can see is dynamically changing a function call.

For example this code :

function foo(){
    console.log('foo');
}

function bar(){
    console.log('bar');
}

var myFn = foo;

myFn();

setInterval(function(){
    if(myFn === foo) myFn = bar;
    else myFn = foo;
}, 5000);

setInterval(function(){
    myFn()
}, 6000);

It will never log the same thing since you reassign a global variable, every innerscope function will change while this code :

function foo(){
    console.log('foo');
}

setInterval(function(){
    function foo(){
        console.log('Changed foo');
    }

    foo()
}, 5000)

setInterval(function(){
    foo()
}, 5000)

Will log 2 different things. You can only change the current scope function, not the global.

My Experiment: function expression we need to use when use that function in different scopes. For example.

function outer(){
       function inner(){

       }
}
outer();
inner();// Error ...calling inner..will not be found..

-this will not work. But

var inner;
function outer(){
 inner=function(){

       }
}
outer();
inner();// will work

-this will work

Generally you should be using declared functions any-time you need a function to be accessible in multiple places.

In javascript, declaring a function is simply syntactic sugar for foo = function(){...}.

Both have their uses, with both having subtle (hard to quantify) advantages in individual situations.

Generally, the advantage is that it's a "throwaway" function. It exists to do a single, quick job, and to give it its own separate declaration would be a waste of time and space. There isn't anything an expressed function can do that a declared function can't. Like I said, it's subtle and hard to quantify