What is difference between these two functions?

Question

I have tried folllowing two ways of referring a function:

First

let a = function() {
   somefunction();
}

Second

let a = somefunction;

Where somefunction is the following in both cases:

function somefunction() {
  alert("hello");
}

Is there any difference between these two ways?

Answer 1

Yes, there is a difference between your two examples.

In the first case, you are defining a new anonymous (unnamed) function which calls somefunction. You are then assigning your new function definition to the variable a. a holds a reference to your new function.

In the second case, you are simply assigning your original function of somefunction to the variable a. The variable a then holds a reference to somefunction. You are not creating a new function as you are in the first case.

Answer 2

I think this example may make the difference clear. arguments is an array like object that contains each of the arguments passed to a function.

Try running each of these lines on your favorite browser console.

var somefunction = function() { console.log(arguments); };

Your first example demonstrates defining a named function a that closes around the named function somefunction.

var a = function() { somefunction(); };

Your second example makes a reference, b, directly to somefunction. This makes invoking b the same as invoking somefunction.

var b = somefunction;

Now if you call each of these a and b with some arguments you will see the difference.

=> a('a', 1);
[]

=> b('a', 1);
['a', 1]

In the first case the arguments object is empty. That's because the arguments that were passed to a were not forwarded onto somefunction.

In the second case the arguments are available to somefunction, because some function is being called directly.

Here is how you could redefine a so that it were functionally equivalent using apply

var a = function() { somefunction.apply(this, arguments); }

Running this at your console prints the argument array.

=> a('a', 1);
['a', 1]

Answer 3

var a = function(){
   somefunction();
}

Is an Anonymous Function attributed to a variable.

somefunction :function() {
  alert("hello");
}

Is an declaration of a function throungh the Object Literal notation.

The diference are shown when you are creating an object. The anonymous function are not acessible as a "public" method, instead in the Object Literal notation, that are acessible from outside.

As Douglas Crockford said, in JS the Good Parts, the first declaration are just a function and the second one could be a method.

Answer 4

In the first case, you are creating a function which calls someFunction(), then you assign that function to a, so now calling a() calls an anonymous function which in turn calls someFunction().

In the second case, a and someFunction become the exact same thing, calling a() is the same as calling someFunction().

Answer 5

The way you're setting var a by accessing the function is clearly out of scope. So I suspect you have a typo : instead of = :

var somefunction = function() {
  alert("hello");
};

somefunction(); // hello

...Now that your first and second makes sense with the code above:

Anonymous Function stored in variable:

var a = function(){
   alert('Hey');
   somefunction();
};
a(); // Hey // hello

Variable as Function Reference

var a = somefunction;
a(); // hello

---

In the other case than:

var objLiteral = {
  somefunction : function() {
      alert("hello");
  }
};

var a = objLiteral.somefunction;
a(); // hello