Javascript prototypal Inheritence

Question

var Person = function(name){
    this.name = name;

    this.sayName = function () {
        console.log("My Name is "+ this.name);
    }
}

var nitin = new Person("Nitin");

nitin.sayName(); // My Name is Nitin


// Codebreak

var Person = function(name){
    this.name = name;
}

Person.prototype.sayName = function (){
  console.log("My Name is "+ this.name);
}

var nitin = new Person("Nitin");

nitin.sayName(); // My Name is Nitin

I was going though inheritance in JS, but for both the approaches above result is same. So I am confused here which approach to follow and why?

Short answer, the last one is better – Endless Aug 17 '18 at 08:00 — Endless, Aug 17 '18 at 08:00

score 3 · Accepted Answer · answered Aug 17 '18 at 08:02

3

The former has an empty prototype consisting only of the constructor function. The latter has a prototype with a behavior (sayName).

There is no possibility to inheriting behavior from the first example, as it has no prototype, whereas in the second example, the prototype can be passed on and thus inherited from.

Moreover, from a memory management / code execution standpoint, the prototype is more efficient. V8 (Google's JavaScript interpreter), and most other JS interpreters, will construct reusable code from prototypes when interpreting them. This both saves space from not needing multiple different functions, as well as speed from not needing to construct them each time the need arises.

answered Aug 17 '18 at 08:02

Travis J

81,153
41
202
273

It seems like you can easily inherit behavior from the first one by calling the constructor in the subclass constructor: `function subClass(name){ Person.call(this, name) }` – Mark Aug 17 '18 at 08:11
@MarkMeyer - There are ways to access the behavior through other means, especially if you preserve the execution context. It just gets trickier to actually use it in the sense of inheritance. – Travis J Aug 17 '18 at 08:15

Javascript prototypal Inheritence

1 Answers1