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.

user2864740
  • 60,010
  • 15
  • 145
  • 220
Mark Estrada
  • 9,013
  • 37
  • 119
  • 186
  • See http://stackoverflow.com/questions/336859/var-functionname-function-vs-function-functionname?lq=1 - 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. – user2864740 Aug 15 '14 at 07: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. – Mark Estrada Aug 15 '14 at 07: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 http://stackoverflow.com/a/3344397/2864740, and then balance it off the other answers. – user2864740 Aug 15 '14 at 08: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. – user2864740 Aug 15 '14 at 08:08

2 Answers2

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

neelsg
  • 4,802
  • 5
  • 34
  • 58
  • 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. – user2864740 Aug 15 '14 at 08: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 '14 at 09:41
  • 1
    I indeed don't agree, but I can respect thought-out rational for such a choice. – user2864740 Aug 15 '14 at 09: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).

alex
  • 479,566
  • 201
  • 878
  • 984