What is the need to declare the constructor/super of an extended class?

Asked

Viewed 143 times

1

I have a class, example:

class Animal {
  constructor(raca) {
    this._raca = raca;
  }

  get raca() {
    return this._raca;
  }

  printRaca = function() {
    console.log(this._raca);
  }
}

And then I extend it this way:

class Cachorro extends Animal {
	
}

Notice that I did not call the builder, nor the super(). However, if I instantiate the class Cachorro it works the same way as class Animal, and I can take the this._raca even without having called the constructor(raca) { super(raca) } and use it normally, see:

class Animal {
  constructor(raca) {
    this._raca = raca;
  }

  get raca() {
    return this._raca;
  }

  printRaca = function() {
    console.log(this._raca);
  }
}

class Cachorro extends Animal {
	
}

var dog = new Cachorro('poodle');
console.log(dog.raca); //'poodle'
dog.printRaca(); // 'poodle'

What is the need then to call the builder and the super()? Is there any consequence in not calling them?

  • I noticed it’s a mistake.

  • Where? I did here several times and I had no error, including running the snippet right here on the site works.

  • SyntaxError: fields are not currently supported

  • Can you at least tell me why it works for me and not for you? I have nothing special in my browser, I am using the normal Chrome in a Ubuntu 18.0

  • 2

    Google Chrome works, Firefox does not, giving error "Syntaxerror: Fields are not Currently supported"

  • 2

    The problem of incompatibility is in doing printRaca = function... instead of declaring it as a normal class method, printRaca() {...}.

  • 1

    https://stackoverflow.com/questions/56083707/how-to-fix-syntaxerror-fields-are-not-currently-supported-error-in-javascript https://www.chromestatus.com/feature/6001727933251584

Show 2 more comments

1 answer

7


Every class has a default constructor created that you don’t even see, if you didn’t have it you couldn’t instantiate the class. In classes that are derived from other constructors this constructor makes the call to the constructor of the base class even without you seeing it there. You only need to do this if you need a builder to do something more specific. In this case it is necessary because you need to initialize the base constructor with an argument, the derived class has no way of guessing this. But the JS tries to guess and he can hit. In this case language so make your life easier, at the risk of doing something wrong, and creates a constructor for you that gets the same arguments you have to pass to the base constructor.

Most codes do much more than is visible. For some reason, especially Javascript programmers believe that the less code you see the less you’re doing and the faster it is, when it’s the opposite, "always" has something hidden running.

If you create your own builder and do not call the super() properly will not build the object in a way that can be used properly or will even generate an error. So you need to understand What good is a builder?. See that, contrary to the premise of the question, so does not work:

class Animal {
    constructor(raca) {
        this._raca = raca;
    }
    get raca() {
        return this._raca;
    }
}

class Cachorro extends Animal {}

var x = new Cachorro();
console.log(x.raca);

And so it works:

class Animal {
    constructor(raca) {
        this._raca = raca;
    }
    get raca() {
        return this._raca;
    }
}

class Cachorro extends Animal {
    constructor(raca) { super(raca) }
}

var x = new Cachorro("raça");
console.log(x.raca);

I put in the Github for future reference.

Note that it has error in the question code and does not work in every browser, so for all intents and purposes for the web it is an invalid code and should not be used.

Fiat 147 todo detonada andando pelas ruas

  • Thank you for the reply.

  • @Maniero, I’m gonna bother you a little... I don’t understand why you say that your two examples work differently, but they behave in a similar way when the instantiation receives the same parameters. Example. The first returns undefined because raca is undefined in your first example. If you pass a string in the constructor of the first example, it will work as the second.

  • @fernandosavio in fact lacked to write about it, the fact that his question has an error and do not give to test in qq situation ended up confusing things, I added about this.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.