difference in defining functions : JavaScript

Question

Do we have any difference between the two mentioned function declaration in JavaScript

//Declaration 1
var foo = function(){

// code goes here
}

and

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

When i tried to use foo's definition as a class to create other objects

var newObj = new foo();

The Declaration 2 worked but Declaration 1 did not allow me to create and object of this type

Yes this is a duplicate, sorry the question header was not easily searchable — sij, Jul 29 '13 at 08:00

score 2 · Answer 1 · answered Jul 29 '13 at 07:46

this is a function expression:

//Declaration 1
var 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 2
function 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 undefined
var foo = function() {alert('hello');}

score 0 · Answer 2 · answered Jul 29 '13 at 07:25

0

First creates a local variable that is assigned a function to. The second declaration creates a function. In first case there is no function to be used for the clients. This is why you can not create objects.

answered Jul 29 '13 at 07:25

Stimpson Cat

1,131
13
37

score 0 · Answer 3 · answered Jul 29 '13 at 07:28

0

Check this fiddle. It is allowing both declaration:

//Declaration 1
var foo1 = function(){

alert('Declaration 1');
}

//Declaration 2
function foo(){
 alert('Declaration 2');
 }
var b= new foo1();
var a=new foo();

answered Jul 29 '13 at 07:28

Zaheer Ahmed

26,435
11
70
105

score 0 · Answer 4 · answered Jul 29 '13 at 07:29

0

You can create object of function. here in your case declaration 1 consider foo is a variable so you can not create object of any variable that is why Declaration 2 worked and Declaration 1 did not allow you.

answered Jul 29 '13 at 07:29

Dhaval Bharadva

2,825
1
20
33

score 0 · Answer 5 · answered Jul 29 '13 at 07:43

The first one creates an anonymous (nameless) function and assigns it to a variable called foo. The second one declares a function with the name foo. Usually those two forms can be used pretty interchangeable but there are still some differences. The following two are the main differences that come to my mind. The first one might be responsible for what you are experiencing:

Hoisting

In the second example, the complete function definition will be hoisted up to the top of the current scope. So when you write:

var a = new A();
function A() {}

JavaScript will interpret this as:

function A(){}
var a;
a = new A();

...and your code will work fine.

In the first example however, only the variable declaration will be hoisted up. The function body stays where it is. So this:

var a = new A();
var A = function(){};

will be interpreted as this:

var a, A;
a = new A();
A = function(){};

which will lead to an error, since A is still undefined by the time you try to create an instance.

The name property

As I said, the first one creates an anonymous function. That means, if you try to access the name property of that function it will return an empty string:

var A = function(){};
console.log(A.name) //{empty string}

In the second example, your function has the actual name A:

function A(){}
console.log(A.name) //A

difference in defining functions : JavaScript

5 Answers5