Function Declaration In Variable Object

test(); //working function test(){//do something} Is this related to (global)variable object? Does the function push to variable object before execution process start? UPDATE: Ok

Solution 1:

See the Scope Cheatsheet on MDN

function foo() { }hoistsfoo to the top of scope automatically

Is this related to (global)variable object? Does the function push to variable object before execution process start?

Nope, it's just hoisting.

---

Consider this example:

foo();
// ReferenceError: foo is not defined

(function(){
  foo();
  function foo (){
    console.log("A");
  };
})();
// A

(function(){
  foo();
  function foo (){
    console.log("B");
  };
})();
// Bfoo();
// ReferenceError: foo is not defined

Hoisting just "lifts" the variable name to the top of the scope.

---

My opinion:

I never write functions as:

function foo() { ... }

I prefer being explicit because magic behavior sucks; I always write functions as

var foo = function() { ... }

If I feel like the function needs a name, I will give it a name, but still define with var

var foo = function foo() { ... }

---

@bfavaretto raises a valid concern:

About your opinion... var foo = function() { ... } also hoists foo to the top, but with an undefined value. So there's implicit stuff going on there too

True, it does hoist foo with an undefined value, but things will all work as desired.

foo();
// TypeError: undefined is not a function// This is good. We don't want the above function to run like that.// This is a fatal error; the script won't even continue to run as-is.// Comment out the above line to get it to run.var foo = functionfoo() {
  console.log("foo");
};

var foo2 = functionfoo() {
  console.log("foo2");
};

// Even with the same function name, these two functions will// output the correct values.foo();  // foofoo2(); // foo2

All of that said, it would be silly to have two functions with the same name identifier in the same scope. But, even if you do make a mistake and write bad code like that, if you're using function expressions as described above, the code would still work anyway. If you just used named functions like in the original question, it certainly will not.

Solution 2:

I think you are talking about Hoisting here. I always prefer labeled function instead of function expression.

this is a function expression:

//Declaration 1var foo = function(){

// code goes here
}

• The func expression in this case is anonymous but assigned to a var foo. for reference

This is a labeled function :

//Declaration 2function foo(){
 // same code here
 }

• There's not really any great reason to do expression to var. You should always try to use labeled statements for constructors,so you can identify an object's 'type' via its constructor.

• people mostly use this where hoisting is needed.Hoisting simply means calling something before it is defined.

  Very very simple example:

  foo(); // alerts 'hello'function foo() {alert('hello');}
  V/s 
  foo(); // throws an error since foo is undefinedvar foo = function() {alert('hello');}
  

REFER:var functionName = function() {} vs function functionName() {}