如何用闭包调用Javascript函数？

Question

Version 1

 function sayHello2(name){ var text='Hello'+name; var say=function(){ console.log(text); }; return say; } var say2=sayHello2("David"); say2(); 

Version 2

 function sayHello2(name){ var text='Hello'+name; var say=function(){ console.log(text); }; return say; } sayHello2("David")(); 

Questions:

1. Why in version one, when you use var say2 to call sayHello2, you don't have to add another set of empty parentheses?
2. If I take off the line return say;, the error message will say sayHello2 is not a function, why?
3. Why is the point of say2(); (the last line in version2)? If I delete that line, nothing changes, 'HelloDavid' will still be logged.

Answer 1

1. In both samples of code, two function calls are made. The difference between the first and second is that in the first sample, the result of the first function call is stored in say2 before the second function call is made. The second sample immediately uses the return value from sayHello2() to call that returned function.

2. If there's no return statement, then sayHello2() returns undefined .

3. The claim of this question, that removing the say2(); line does not change the behavior, is incorrect. If you don't call say2() then nothing will be logged.

Look at sayHello2() :

function sayHello2(name){
  // Initialize the text that will be logged
  var text='Hello'+name;

  // Create the function that will log the message
  var say=function(){
    console.log(text);
  };

  // Return the logging function
  return say;
}

The sayHello2() function returns a reference to that little function that calls console.log() . Because functions are object values in JavaScript, a reference to a function works as well as any other sort of value, and can be stored in a variable or used in an expression.

Note that when the logging function is created, that's done with a var initailization:

  var say=function(){
    console.log(text);
  };

That's essentially the same thing that happens to the variable say2 :

var say2=sayHello2("David");

except that here, on the right-hand side of the = sign there's a function call instead of a function instantiation.

The statement

say2();

therefore is calling that little logging function that was returned from the call to sayHello2() .

The second code sample does the same thing:

sayHello2("David")();

except that there's no intermediate storage of the returned function reference. Instead, the reference is immediately used to make the second function call.

In the first version, count the function calls made:

var say2 = sayHello2("David"); // First function call
say2(); // Second function call

In the second version:

// First          // Second
sayHello2("David")();

In JavaScript, an expression of the form

something()

always means, "Interpret something as a reference to a function, and call it (passing no parameters)." If something is not a reference to a function, you get an exception. So in version 2, our something is sayHello2("David") . Because that's got the second set of empty parentheses after it, it means we're telling JavaScript to make another function call.