7

I am debugging someones else code now and I am just confused when he defines constructor in these two modes. Is there anything special between the two?

//constructor 1
var MyObject = function(){

};
//constructor 2
var MyObject = function MyObject(){

};

Also, whats the effect of just creating a function just like this.

function MyObject(){};

I am just looking at certain use cases for each.

4
  • See stackoverflow.com/questions/336859/… - I've decided to vote as a duplicate because all the questions are answered in the accepted answer (difference between 2nd and 3rd forms) and second most popular answer (difference between the 1st and 2nd forms). Being a constructor is only a secondary concern to a normal function. Aug 15, 2014 at 7:52
  • Sorry, I saw that question as well but I do understood the concept of parsetime and runtime function declaration so I did try to ask in terms of object oriented point of view. Aug 15, 2014 at 7:59
  • That wording is a bit .. crummy (it's much better to think of the function declaration being a function that is created and bound to a local identifier as soon as the the containing scope is entered, before any other code is executed, and forget about "parse-time"). See stackoverflow.com/a/3344397/2864740, and then balance it off the other answers. Aug 15, 2014 at 8:01
  • Also, there is nothing "object oriented" about these differences; as "OOP" only enters when the function is treated as a constructor and invoked with new. (That isn't entirely true, eg. "OOP" can be achieved with Object.create without the use of the new keyword, or with even less help from JS's [prototype] property resolution, but that is a digression.) Creating a function, with any of the above forms, is .. just creating a function. Aug 15, 2014 at 8:08

2 Answers 2

2

The different options:

1) Function is not named, so you don't get a function name in MyObject.toString()

var MyObject = function(){};

2) Function is named, so you get a function name in MyObject.toString(), but this is deprecated anyway.

var MyObject = function MyObject (){};

Effectively, there is no practical difference between (1) and (2)

3) Function declaration instead of function expression (See discussion on topic)

function MyObject() {}

This is different from the previous options in that it is in scope before the actual declaration, so the following code works fine:

MyObject();
function MyObject() {}

But, if you try this:

MyObject();
var MyObject = function(){};

You get an error.

I generally just stick to option 1, since it seems to be the most logical

3
  • I think option one is the worst in the general case. It does not allow forward declaration or usage, it promotes creation of functions not at the top-level scope of another function (and as far as closures go that is the sanest place for them to be declared), and the created function doesn't even have a real name. With very few exception I use the third form. Usage of the first form in my code effectively only happens when I might assign "this or that function" to an identifier, generally for immediate use in a HoF. Aug 15, 2014 at 8:14
  • @user2864740 Thanks for the comment, this is more preference than anything else, but I'll explain my thinking: (a) Function names should not be used in good code, relying on it breaks things. (b) The second option is more typing and you repeat yourself, so against DRY principle. (c) This forces you to declare a function before using it, so code is a bit more logical. (d) Assigning a function to a variable is the same as assigning a value to it, so the syntax should be the same, the syntax is also the same for object methods, which makes sense. That is just my opinion... you don't have to agree
    – neelsg
    Aug 15, 2014 at 9:41
  • 1
    I indeed don't agree, but I can respect thought-out rational for such a choice. Aug 15, 2014 at 9:56
0

The only difference between the two is the latter you can refer to the function internally by function name (though in your case, they have the same name). In some older IEs, they leaked this name to the surrounding scope.

It's also useful to have it named for things like examining the call stack - the named function is the name which will be used (at least in Chrome's inspector).

Not the answer you're looking for? Browse other questions tagged or ask your own question.