The difference between different object designations

Question

What is the difference between creating an object using the built-in constructor of objects and creating an object that immediately calls the constructor? I always did the latter because it freed me from having to call something like init () and I felt right, but I continue to see the designation of the object in other people's code and wonder if there is another difference. without seeing.

Example:

window.fooModule = { init: function() { this.bar = "cee"; doStuff(); }, doStuff: function() { ... } } window.fooModule.init(); 

Example 2:

 window.fooModule = new function(){ this.bar = "Cee"; this.doStuff = function() { ... } this.doStuff(); } 

Answer 1

In the first notation of the fooModel variable, an object was created without calling the constructor, in the second notation of fooModel , an object was created with the constructor fooModel as an anonymous function, therefore when using the constructor function of the keywords new , the object is called from its prototype (in this example, the prototype is not declared, therefore it is prototype standard object).

Conclusion

Use the second notation, if your object should call code when it is created, use first if not.

More on the second notation

The second notation also allows you to use local (private) variables and functions inside the constructor, because the constructor gives us our own scope.

 var obj=new function(){ var priv="Local scope variable"; var method=function(){ console.log("Local method"); }; this.doStuff=function(){ //here local methods and variables can be used }; }; 

The second notation with the constructor and new more often used with the standard declaration of the constructor function and the prototype declaration. This is the right way if we need to create more than one object. Methods and all common properties must not be declared in the prototype in the constructor.

 var ExampleClass=function(bar){ //constructor this.bar = bar; }; ExampleClass.prototype.doStuff=function(){ }; 

Creating such an object:

 var a=new ExampleClass("A bar"); //a.bar is "A bar" var b=new ExampleClass("B bar"); //b.bar is "B bar" 

Objects a and b have the same prototype (it saves memory) , but they can have different properties specified in the constructor.

Offtop

There are so many possibilities for creating objects in javascript, I have a third example of how to run the code in the first notations:

 window.fooModule = { init: function() { this.bar = "cee"; this.doStuff(); return this;//return this }, doStuff: function() { } }.init();//run init after object notation 

I create an object and run init at a time.

Answer 2

let the first example return obj1 and the second example return obj2

obj1 will have a [[Prototype]] object. This object has the constructor property "function Object ()"

obj2 will have a [[Prototype]] object. This object has the constructor property of an anonymous function.

The method in the second example is usually used to achieve something that we call "singleton"

Bonus: this stuff is easy to confuse, but if you want to dig deeper, here is a good post for you.

https://zeekat.nl/articles/constructors-considered-mildly-confusing.html

Answer 3

There are objects and there are prototypes of definition objects. None of your examples are prototypes of definition objects.

 window.fooModule = function(bar){ this.bar = bar; (this.doStuff = something => { console.log(this.bar,'is doing', something || 'something'); })(); }; [a,b]= [new fooModule('a'), new fooModule('b')]; 

If you just want to create an object, you can skip the new and this operator.

 (window.fooModule = { bar : 'Cee', doStuff : something => { console.log(foo.bar,'is doing', something || 'something'); }}).doStuff();