JavaScript hoisting function vs function variable

问题

Here is my javascript code :

    console.log(a);
    c();
    b();            
    var a = 'Hello World';
    var b = function(){
        console.log("B is called");
    }
    function c(){
        console.log("C is called");
    }

Now here is output :

undefined
hoisting.html:12 C is called
hoisting.html:6 Uncaught TypeError: b is not a function

My question is regarding why c() and b() behaving differently. And b should throw error something like b is not defined.

回答1:

A Function Declaration will be hoisted along with its body.

A Function Expression not, only the var statement will be hoisted.

This is how your code "looks" like to the interpreter after compiletime - before runtime:

 var c = function c(){
      console.log("C is called");
 }

 var a = undefined
 var b = undefined

 console.log(a); // undefined at this point
 c(); // can be called since it has been hoisted completely
 b(); // undefined at this point (error)

 a = 'Hello World';
 b = function(){
     console.log("B is called");
 }

KISSJavaScript

回答2:

Function Expression:

  var b = function(){
        console.log("B is called");
    }

Function Declaration:

function c(){
    console.log("C is called");
}

Function Expressions loads only when the interpreter reaches that line of code.On the other side the function Declaration, it'll always work. Because no code can be called until all declarations are loaded.

Read more about Function Declaration and Function Expression

回答3:

At the time you are calling b is not defined yet. Your b is a variable which contains function, and the time you are accessing b it has not been defined yet.

回答4:

Because declare a function with Function Expression create an anonymous function unless you explicitly provide a name :

var b = function() {}   // anonymous function

and differently when you declare a function with Function Declaration, you set a name :

function c() {}   // c function

来源：https://stackoverflow.com/questions/35253376/javascript-hoisting-function-vs-function-variable

标签

javascript

hoisting