ES6 javascript Subclass not inheriting all variables?

Question

So basically I have an es6 js class where constructor variables are created then assigned within a class method. Later I create a sub class that extends the first and pass all variables I wish to use to the subclass constructor and subsequently to the super method. After this one variable is correct and the other is undefined, both are created passed and logged in the same manner. Why would it be undefined??

class socket {
  constructor() {
    this.socket = {};
    this.base = '/*string*/';
    this.mainIndex;
    this.dashboard;
    this.user_id;
  }

  socket_start() {

    //do stuff here to start websocket

    self.socket.onmessage = function ( event ) {
      let stream = JSON.parse( event.data );
      this.mainIndex = stream.url.mainIndex; 
      this.dashboard = stream.url.dashboard; 
      this.user_id = stream.staffInfo.id; 
      this.base = stream.base;  

      console.log( this.user_id ); // "1"
      console.log( this.base); // "string"
    }
  }
}


class main extends socket {
  constructor( user_id, base, socket, mainIndex, dashboard ) {
  super( user_id, base, socket, mainIndex, dashboard );


  console.log( this.user_id ); // undefined   <--????
  console.log( this.base); // "string"
}

Your parent class constructor ignores all the arguments it is passed. — Hunter McMillen
– Hunter McMillen, Commented Dec 8, 2017 at 20:52
Your parent constructor does only create the .socket and .base properties by assignment. All the other properties are created later in that onmessage callback. — Bergi
– Bergi, Commented Dec 8, 2017 at 23:26

Hunter McMillen · Accepted Answer · 2017-12-08 20:55:54Z

1

Your parent class ignores any arguments that it is passed. Compare the two versions below:

class A {
  constructor() {
    this.name;
  }
}

class B extends A {
  constructor(name) {
    super(name)
  }
}

> new B("Hunter");
B {}

Now an example with the correct behavior:

class A {
  constructor(name) {
    this.name = name;
  }
}

class B extends A {
  constructor(name) {
    super(name)
  }
}

> new B("Hunter");
B { name: 'Hunter' }

answered Dec 8, 2017 at 20:55

Hunter McMillen

61.8k25 gold badges124 silver badges176 bronze badges

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

5 Comments

KyleM Over a year ago

So why do all of the other variables passed work in my example except 1?

Hunter McMillen Over a year ago

You set the value of base explicitly in your socket constructor, so it makes sense that it is defined in subclass main

KyleM Over a year ago

Would this.user_id = 0; in socket class - then change it in the method work then?

Hunter McMillen Over a year ago

It would make it 0 all the time. What you really want is to accept the user_id that your subclass passes to the parent in its call to super.

KyleM Over a year ago

My only concern is that I alter the variables within the methods of the class only, NOT on creation of the instance such as let x = new main() <-- nothing is passed here as an arg. Does that matter?

Collectives™ on Stack Overflow

ES6 javascript Subclass not inheriting all variables?

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related