CODEWITHSUNDEEP
javascriptstringobject
user431806
user431806

Reputation: 416

JS object inheritance with attributes

Im trying to get a very simple inheritance pattern for my Project going, extending from a base class into a specialized class. However, my specialized class's attributes are being overwritten by the parent's attributes.

Why is that and how can i fix it ?

thanks,

function Ship(className, x, y){
    this.className = className;
    this.x = x;
    this.y = y;
    this.speed = 0;
}

function Corvette(className, x, y){
    this.className = className;
    this.x = x;
    this.y = y;    
    this.speed = 100;        
    Ship.call(this, className, x, y)
}


Corvette.prototype = Object.create(Ship.prototype);   

var ship = new Ship("Biggie", 50, 50);
var corvette = new Corvette("Smallish", 50, 50);

console.log(Corvette.className) // "Smallish" - correct via parameter.
console.log(Corvette.speed) // should be 100, is 0 - not correct, "static" from parent attribute
console.log(Corvette.constructor.name) // Ship

Upvotes: 0

Views: 50

Answers (3)

Suren Srapyan
Suren Srapyan

Reputation: 68645

Why you have the same properties in the child object which are already in the parent's?

I suggest you to do

function Ship(className, x, y, speed = 0) {
    this.className = className;
    this.x = x;
    this.y = y;
    this.speed = speed;
}

function Corvette(className, x, y, speed = 100) { 
    Ship.call(this, className, x, y, speed);
}

Corvette.prototype = Object.create(Ship.prototype);   
Corvette.prototype.constructor = Corvette;

var ship = new Ship("Biggie", 50, 50);
var corvette = new Corvette("Smallish", 50, 50);

console.log(corvette.className) // "Smallish" - correct via parameter.
console.log(corvette.speed) // should be 100, is 0 - not correct, "static" from parent attribute
console.log(corvette.constructor.name) // Ship

and if your browser supports some features of ES6 use this feature ES6 classes.

class Ship { // And also Ship is an abstractionm so you can use `abstract` keyword with it
  constructor(className, x, y, speed = 0) {
    this.className = className;
    this.x = x;
    this.y = y;
    this.speed = speed;
  }
}

class Corvette extends Ship {
   constructor(className, x, y, speed = 100) {
        super(className, x, y, speed);
   }
}

var ship = new Ship("Biggie", 50, 50);
var corvette = new Corvette("Smallish", 50, 50);

console.log(corvette.className) // "Smallish" - correct via parameter.
console.log(corvette.speed) // should be 100, is 0 - not correct, "static" from parent attribute
console.log(corvette.constructor.name) // Ship

Upvotes: 1

Dhananjay
Dhananjay

Reputation: 554

You should invoke the parentclass contructor first and then override the properties, this way the properties set by Corvette will not be changed by the parent class i.e.:

function Corvette(className, x, y){
    Ship.call(this, className, x, y)      
    this.speed = 100;        

}

Upvotes: 0

rpadovani
rpadovani

Reputation: 7360

You only need to move Ship.call(this, className, x, y) at the start of Corvette function.

Also, next time, before posting code, check it is correct, you wrote console.log(Corvette) instead of console.log(corvette)

Another thing: you do not need to repeat params you do not want to overwrite

function Ship(className, x, y){
    this.className = className;
    this.x = x;
    this.y = y;
    this.speed = 0;
}

function Corvette(className, x, y){
    Ship.call(this, className, x, y)   
    this.speed = 100;        
}


Corvette.prototype = Object.create(Ship.prototype);   

var ship = new Ship("Biggie", 50, 50);
var corvette = new Corvette("Smallish", 50, 50);

console.log(corvette.className)
console.log(corvette.speed)
console.log(corvette.constructor.name)

Upvotes: 0

Related Questions