0

While going over frontend master, I got little confused w/ below. Can someone tell me if there is any difference? (in creating Object Chordate and Chordate2 and Chordate3?). HOw do they fundamentally differ??

I thought always doing newObject = new constructor is the way to build new object in javascript but this newObject.prototype = new Constructor threw me off. 

  Animal = function(name){this.name = name};
  Animal.prototype.eats = function(){
          return this.name + " is eating"
  }

  Chordate = function(name){this.name = name;}
  Chordate.prototype = new Animal();

  Chordate2 = function(name){this.name = name;}
  Chordate2 = new Animal();

  Chordate3 = new Animal();

-- my own answer --

Probably I need to watch more videos (as I assume they will say this is not recommended but I do understand how this works now. Here was my confusion and clarification.

Every function(which is another object) that gets created is pointed to it's own prototype(basically object) Chordate which is already an object and has it's own prototype pointed to it's own object(prototype), this line(Chordate.prototype = new Animal();) is changing .prototype point to Animal prototype. (which does look hacky, and I need to read and watch more).

So, based on that Chordate2's prototype is also it's own prototype and when you run new Animal on it, it just erases that and only Animal.prototype exists.

Same w/ (except Chordate3.prototype never existed) Chordate3.

Can someone please verify this for me?

Improve this question
10
  • 1
    1. Chordate2 and Chordate3 are identical. 2. You are missing variable declarations (see var or let or const). Commented Sep 5, 2016 at 2:49
  • ok, let's get past the 2), but for Chordate? How do they differ? Commented Sep 5, 2016 at 2:54
  • Chordate is a constructor. Chordate2/Chordate3 is an instance. Not sure how it's even possible to compare them. Commented Sep 5, 2016 at 2:55
  • Chordate2 = new Animal() replaces the value assigned in the immediately previous assignment. Chordate.prototype = new Animal(); replaces the default Chordate prototype with an instance of Animal so that Chordate instances inherit from both Animal and Chordate. Commented Sep 5, 2016 at 3:00
  • What is your question exactly? Commented Sep 5, 2016 at 3:15

3 Answers 3

Reset to default
1

That's how inheritance originally works in javascript (and even with classes, the underlying mechanism is still the same).

Basically Chordate is a subclass of Animal. In other languages we'd write:

class Chordate extends Animal {

}

In javascript constructors inherits from objects. Since Animal() is a constructor we need to convert it to an object. So in javascript we do:

Chordate.prototype = new Animal(); // extend Animal

The prototype property holds a prototype or template for how the object created by a constructor should look like. In this case the object created by Chordate should look like an Animal object. When you call new Chordate() the prototype will be copied into this and will be returned as a new instance.

Chordate2 and Chordate3 are just instances of Animal. From the code and the naming of the objects they look like confused code by someone not familiar with javascript. I'd personally expect something like chordate2 = new Chordate().

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

2 Comments

"So in javascript we do" --- actually we don't. In JS WE do Chordate.prototype = Object.create(Animal.prototype); (followed by setting a constructor).
That is a seriously confusing explanation. "Since Animal() is a constructor we need to convert it to an object", ugh. "When you call new Chordate() the prototype will be copied into this" is completely wrong.
0

The first Chordate assignment "Chordate=function(name){this.name=name;} is assigning a constructor identical to that of Animal, and then the next line adds the Animal() constructor to the Chordate object.

Then Chordate2 starts off with a constructor assignment and then is overwritten as an Animal object with an undefined name attribute since no argument was passed to the constructor.

Finally Chordate3 is just an Animal object with an uninitialized name attribute as well.

Improve this answer

1 Comment

"…adds the Animal() constructor to the Chordate object." should be "…assigns an instance of Animal as the Chordate.prototype object".
0

I do feel funny about responding to my own question and putting it as an answer but as @torazaburo suggested and it would be good for me to get critic as someone who actually provides an answer(up until now, I have only asked) even if it’s wrong so here it goes:

Part of the confusion came as to what below actually is

Object.prototype

I fully understand that when function is created(Animal), it points to its own prototype(which in turn points to base Object(of it’s own prototype(this is found by going up the proto chain).

when Chordate function was created, it was pointing to it’s own prototype. However, when Chordate.prototype = new Animal was ran, it essentially overwrote it’s own prototype and pointed to Animal’s prototype. Whether this is not recommended or not, I am eager to find out why. I guess I was more focused on learning how this Object.prototype works and what the relationship was to otherObject(in this case Animal) being created.

When Chordate2 is ran,
   1)it creates a function and have it point to it’s own prototype
   2)when you run new Animal() = Chordate2, it essentially erases Chordate2 and creates a brand new object and
     only prototype remains is Animal.prototype. Chordate2’s relationship to that is found through __proto__

Same concept w/ (except Chordate3.prototype never existed) Chordate3.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.