Why always declare functions in JavaScript?

Question

I was told that you should always declare functions in JavaScript. It's true? What is its advantage?

I usually assign functions to a variable as such:

var foo = function() {}; 

But presumably this is wrong, something like a stack trace. Can someone explain? I was told:

 var foo = function fooBar() {}; 

Would it be wise if it were attached to an object?

 var Foo = {}; Foo.Bar = function Bar() {}; 

Keep in mind that these functions are not included in the global scope, are not performed independently, and are not used several times.

Answer 1

First of all, a quick note about terminology: you have no function declaration. This function declaration:

 function fooBar() { } 

Creates a function called fooBar , accessible through the variable fooBar . This is an assignment that includes a named function expression:

 var foo = function fooBar() { }; 

The name of the function is still fooBar , but the function is bound only to the variable fooBar inside the function itself, and not outside. The fact that it makes an accessible function within its scope without having to refer to a variable in the outer scope means that there are two reasons to name it:

• For the ability to refer to a function within itself, regardless of the code in the external function!

  This can return what the external function wants:

   function fooBar() { return fooBar.toString(); } var baz = fooBar; fooBar = 5; baz(); // "5" 

  This is always agreed upon:

   var fooBar = function fooBar() { return fooBar.toString(); }; var baz = fooBar; fooBar = 5; baz(); // "function fooBar() { …" 

• And yes, for a more detailed stack trace:

   function trace(func) { try { func(); } catch (error) { console.log(error.stack); } } trace(function () { throw new Error("Bad thing"); }); /* Error: Bad thing at /home/ryan/test.js:10:18 at trace (/home/ryan/test.js:3:16) at Object.<anonymous> (/home/ryan/test.js:9:8) at Module._compile (module.js:410:26) at Object.Module._extensions..js (module.js:428:10) at Module.load (module.js:335:32) at Function.Module._load (module.js:290:12) at Function.Module.runMain (module.js:451:10) at startup (node.js:123:18) at node.js:866:3 */ trace(function descriptiveName() { throw new Error("Bad thing"); }); /* Error: Bad thing at descriptiveName (/home/ryan/test.js:14:18) at trace (/home/ryan/test.js:3:16) at Object.<anonymous> (/home/ryan/test.js:13:8) at Module._compile (module.js:410:26) at Object.Module._extensions..js (module.js:428:10) at Module.load (module.js:335:32) at Function.Module._load (module.js:290:12) at Function.Module.runMain (module.js:451:10) at startup (node.js:123:18) at node.js:866:3 */ 

  (Node.js pictured here.) Notice the descriptiveName at the top of the second stack trace. This is especially convenient when you have several complex systems of asynchronous callbacks, events, methods for transferred objects, etc.