JavaScript inheritance with constructors that have parameters

Question

I am new to JavaScript and trying to get my head around inheritance when I have a constructor that takes parameters.

Suppose I have a base object called Base:

function Base(param1, param2) {
   // Constructor for Base that does something with params
}

I want another object, for example called BaseChild which inherits from Base and then another object called Child which inherits from BaseChild.

How would I go about creating the constructors for BaseChild and Child using basic JavaScript (i.e. no special plug-ins)?.

Note:

I thought you might be able create BaseChild as follows:

var BaseChild = new Base(param1, param2);

But I don't have the values for param1 or param2 in BaseChild, only in Child. I hope this makes sense!.

possible duplicate of How to get a constructor function to inherit from a constructor function in Javascript? — Bergi
– Bergi, Commented Aug 7, 2013 at 10:47

achudars · Accepted Answer · 2013-08-07 09:35:56Z

1

// define the Base Class
function Base() {
   // your awesome code here
}

// define the BaseChild class
function BaseChild() {
  // Call the parent constructor
  Base.call(this);
}

// define the Child class
function Child() {
  // Call the parent constructor
  BaseChild.call(this);
}


// inherit Base
BaseChild.prototype = new Base();

// correct the constructor pointer because it points to Base
BaseChild.prototype.constructor = BaseChild;

// inherit BaseChild
Child.prototype = new BaseChild();

// correct the constructor pointer because it points to BaseChild
Child.prototype.constructor = BaseChild;

alternative approach using Object.create

BaseChild.prototype = Object.create(Base.prototype);
Child.prototype = Object.create(BaseChild.prototype);

answered Aug 7, 2013 at 9:35

achudars

1,50615 silver badges26 bronze badges

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

Collectives™ on Stack Overflow

JavaScript inheritance with constructors that have parameters

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related