Javascript Inheritance using constructor functions

Question

I'm trying to make one constructor function parent of another constructor function.

function Fruit() {
    this.isEatable = function() {
        return eatable;
    };
}
function Apple(eatable , sweet) {
    this.isSweet = function() {
        return sweet;
    };
    var instance = {};
    Fruit.apply(instance);
    _.extend(this, instance);
}

var a = new Apple(true, false);

console.log(a.isEatable()); // Uncaught ReferenceError: eatable is not defined

But as you can see I get an error , what is the reason ? What is the better way to make one function inherit from another function ?

I also tried the following , and I still get the same error :

function Fruit() {
    this.isEatable = function() {
        return eatable;
    };
}
function Apple(eatable , sweet) {
    this.isSweet = function() {
        return sweet;
    };
}

_.extend(Apple.prototype , Fruit.prototype);// I use lodash library
var a = new Apple(true, false);

console.log(a.isEatable()); // Uncaught ReferenceError: eatable is not defined

JavaScript has only lexical scope for variables. Use properties! — Bergi
– Bergi, Commented Oct 28, 2015 at 8:36
@Bergi : I don't expect it to work. I expect instance to have it after calling apply — Arian
– Arian, Commented Oct 28, 2015 at 9:18
Yes, instance does have the isEatable method after you called apply, but the method does not have an eatable variable in its scope - which is where it is declared, not where it is used. For that, you have to use this.. — Bergi
– Bergi, Commented Oct 28, 2015 at 9:22

JosephGarrone · Accepted Answer · 2015-10-28 09:35:27Z

2

Try the following

function Fruit(eatable) {
    this.eatable = eatable;
    this.isEatable = function() {
        return this.eatable;
    };
}

function Apple(eatable , sweet) {
    // Call the constructor of the inherited 'object'
    Fruit.call(this, eatable);

    this.sweet = sweet;

    this.isSweet = function() {
        return this.sweet;
    };
}

// Inherit the Fruit.prototype methods for Apple
Apple.prototype = Object.create(Fruit.prototype);

var a = new Apple(true, false);

console.log(a.isEatable());

This is based off the (Very useful) code given as an example in the MDN Object.create documentation. Here's a JSFiddle.

edited Oct 28, 2015 at 9:35

answered Oct 28, 2015 at 8:27

JosephGarrone

4,1613 gold badges42 silver badges61 bronze badges

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

2 Comments

Arian Over a year ago

If you remove the line at which you do 'Object.create' it still works. right ?

Bergi Over a year ago

@ArianHosseinzadeh: But then a instanceof Fruit no longer works. Also, if you had put the methods on the prototype, like Fruit.prototype.isEatable() { return this.eatable; }; (which in fact you should consider to do), it would no longer work without Object.create inheritance.

Aishwat Singh · Accepted Answer · 2015-10-28 09:03:30Z

-1

just other way

function Fruit() {
    this.isEatable = function() {
        return this.eatable;
    };
}
function Apple(eatable , sweet) {
    this.sweet=sweet;
    this.eatable=eatable;
    this.isSweet = function() {
        return this.sweet;
    };
    this.prototype= Fruit.apply(this);
}

var a = new Apple(true, false);

console.log(a.isEatable());

It's somewhat same thing as @Asryael i guess

short explanation: prototype binds new Fruit object with this of Apple , so you don't need to pass parameters again in root object, this takes care of it .

answered Oct 28, 2015 at 9:03

Aishwat Singh

4,5093 gold badges30 silver badges50 bronze badges

5 Comments

Arian Over a year ago

I don't want to change the prototype of this, because later if someone decides to extend the definition of Apple it won't affect the instances. right ?

Aishwat Singh Over a year ago

can u give an example of "extend the definition" ? i mean if u add new params to apple , it won't affect.

Bergi Over a year ago

this.prototype= Fruit.apply(this); is really really not going to work.

Aishwat Singh Over a year ago

@Bergi care to explain ? nd ya thanks for the downvote

Aishwat Singh Over a year ago

Apple's prototype is a new Fruit object, Fruit object binded to that Apple Object. Whats wrong in this ? Is it bcoz Fruit cannot exist without Apple , as it doesn't have a eatable param

Collectives™ on Stack Overflow

Javascript Inheritance using constructor functions

2 Answers 2

2 Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related