Difference between JavaScript reference type objects and plain objects

Question

I'm currently in the learning process of JavaScript. I'm having a confusion with Objects (Reference type and plain objects). Here are some codes that create an object (reference type) :

function TheObject(first, last) {
  this.first = first;
  this.last = last;
}

TheObject.prototype.theMethod = function() {
  document.write("first : " + this.first + ", last : " + this.last + "</br>");
};

var anObject = new TheObject("Google", "Good");
anObject.theMethod();

Here are some other codes which also create an object (is it also reference type?) :

var TheAnotherObject = function(first, last){
   return {
     first : first,
     last : last,

     theMethod : function() {
       document.write("first : " + this.first + ", last : " + this.last + "</br>");
     }
   };
 }

 var anotherObject = TheAnotherObject("Yahoo", "Good");
 anotherObject.theMethod();

Now, my confusion is where is the actual difference between this two way of creating objects. I know that I can create an Object type in both way (with the "new" keyword). Then what is the difference?

Please help me to understand what point I'm missing here. I know it's very important to understand since JavaScript heavily use functions and objects. Any help would be very much appreciated. Thanks in advance.

The second method doesn't associate a prototype with the TheObject class. — Barmar
– Barmar, Commented Aug 3, 2015 at 19:04
I can sort of guess but don't really know what you mean by "reference type"--where did you see this expression? — user663031
– user663031, Commented Aug 3, 2015 at 19:08
@torazaburo from book "Beginning Javascript" by "Jeremy McPeak". I'm learning from this book. — Provash
– Provash, Commented Aug 3, 2015 at 19:13
This is not standard terminology and frankly is confusing. Although opinions vary on the question of "does JS have classes", it's simplest and most convenient to refer to functions which create objects via new as "classes", and then everyone will pretty much know what you are talking about. — user663031
– user663031, Commented Aug 3, 2015 at 19:37

leo.fcx · Accepted Answer · 2015-08-03 19:11:24Z

1

Main difference is:

1st approach defines theMethod method using prototype. This means that all instances created from that Class, will use same definition of that method (theMethod)

Otherwise, 2nd approach defines a new theMethod method every time a new instance is created from that Class. Which obviously when having too many instances it is going to be expensive since there will be several definitions for theMethod doing the same thing.

answered Aug 3, 2015 at 19:11

leo.fcx

6,4972 gold badges23 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user663031 Over a year ago

when having too many instances it is going to be expensive. Actually, it's not expensive, unless maybe you plan to have millions of instances. We have better things to worry about these days than a few extra bytes of memory. Douglas Crockford promotes this style of programming as I understand it.

Ziad SALLOUM · Accepted Answer · 2015-08-03 19:14:44Z

1

When it comes to the creation they are the same.

However the difference is that the first way the method is assigned to the prototype which means there's only one instance of this method.

While in the second example the method of defined for every new object.

So basically the references of theMethod are not the same which means o1.theMethod != o2.theMethod

answered Aug 3, 2015 at 19:14

Ziad SALLOUM

717 bronze badges

Collectives™ on Stack Overflow

Difference between JavaScript reference type objects and plain objects

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related