Javascript构造函数创建对象与常规对象

Question

Sorry about the maybe misleading title, but I wonder why is this approach of creating objects and adding properties and methods:

//A)
var myObjCreatedByFunction = function() {
  this.prop1 = "a";
  this.func1 = function() {
   alert("a");
  }
};

and then using prototype to create additional methods

myObjCreatedByFunction.prototype.func2 = function() { ... }

preferred over simple and plain creating object:

//B)
var myObj = {
  prop1: "a",
  func1: function() {
   alert("a");
  }
};

and just adding new method by

myObj.func2 = function() { ... }

as I see some skilled developers use the first approach and use prototypes even if they never create new instances later.

Furthermore, is the use of IIFE preferred over both examples and if so, why? (I see a lot of this usage lately)

var myObjIIFE = (function() {
return {
  prop1: "a",
  func1: function() {
   alert("a");
  }
}
})());

Can someone explain please when should I use first approach, second and third and why? Thank you!

Answer 1

B is useful only for a single instance. It does not offer a means to create multiple instances of that type with those methods and properties like A does. If all you want/need is a single instance, then B is just fine and perhaps simpler to express and follow.

There are long discussions about whether to use the prototype for methods or assign them in the constructor (see prior reference and there are many, many other such discussions). Using the prototype and then creating a new object using the new operator will conserve memory (since all methods are shared by all instances). Assigning them in the constructor allows access to private instance variables (the local variables in the constructor) and has slightly better performance when executing a given method.

An IIFE is a pattern some people choose to adopt. It offers no benefit for what you are doing, but does provide a scope to store "private class variables" which are shared by all instances, but not accessible to the outside world. The way you show it, it is not my favorite because there is no type information on the object all. It's just a plain object with properties. In some cases (particularly in debugging, but sometimes in coding), it can be useful to know what type of object you have.