Contenido del Curso
Object-Oriented Programming in JavaScript
Object-Oriented Programming in JavaScript
Overriding
Overriding Methods
In the previous chapter, we redefined the constructor for the daughter class. If there are some methods in the parent class that you want to be different in the daughter’s, you can simply write it again with another function's body:
class Rectangle { height; width; constructor(height, width) { this.height = height; this.width = width; console.log('Rectangle created'); } rotate() { side = this.width; this.width = this.height this.height = side; console.log('Now rectangle has width', this.width, 'and height', this.height); } } class Square extends Rectangle{ constructor(size){ super(size, size); console.log('Square created'); } rotate() { console.log('Rotating square does not change it'); } } square = new Square(5); square.rotate();
Here, if you rotate the square, nothing changes, so we'll override this function to only output the message, not change the sides.
In case if you want to use methods from parent’s class, use super
keyword again. Let's use increase()
method from Rectangle
class inside increaseTwice()
from Square
class.
class Rectangle { height; width; constructor(height, width) { this.height = height; this.width = width; console.log('Rectangle created'); } increase(num) { this.width *= num; this.height *= num console.log('Now figure has width', this.width, 'and height', this.height); } } class Square extends Rectangle{ constructor(size){ super(size, size); console.log('Square created'); } increaseTwice() { super.increase(2); } } square = new Square(5); square.increase(4); square.increaseTwice();
Swipe to show code editor
Let's place our Figures in the boxes. Add to the parent's class function box()
, which outputs the message I am a Rectangle, and I need a box of size
won
h, where w and h are width and height of the current Rectangle. Then override this function in Square
class, so it outputs the message: I am a Square, and I need a box of size
son
s, and s is a length of square's side.
Create Rectangle
and Square
objects and call box()
method for them.
Overriding attributes
Inside the daughter's class, we can refer to any attributes and methods of the parent's class. In general, there is no sense to override attributes because you can refer them directly from the parent's class. The exception is private attributes: they are accessible only inside the current class, that's why you can't override them.
¡Gracias por tus comentarios!
Overriding
Overriding Methods
In the previous chapter, we redefined the constructor for the daughter class. If there are some methods in the parent class that you want to be different in the daughter’s, you can simply write it again with another function's body:
class Rectangle { height; width; constructor(height, width) { this.height = height; this.width = width; console.log('Rectangle created'); } rotate() { side = this.width; this.width = this.height this.height = side; console.log('Now rectangle has width', this.width, 'and height', this.height); } } class Square extends Rectangle{ constructor(size){ super(size, size); console.log('Square created'); } rotate() { console.log('Rotating square does not change it'); } } square = new Square(5); square.rotate();
Here, if you rotate the square, nothing changes, so we'll override this function to only output the message, not change the sides.
In case if you want to use methods from parent’s class, use super
keyword again. Let's use increase()
method from Rectangle
class inside increaseTwice()
from Square
class.
class Rectangle { height; width; constructor(height, width) { this.height = height; this.width = width; console.log('Rectangle created'); } increase(num) { this.width *= num; this.height *= num console.log('Now figure has width', this.width, 'and height', this.height); } } class Square extends Rectangle{ constructor(size){ super(size, size); console.log('Square created'); } increaseTwice() { super.increase(2); } } square = new Square(5); square.increase(4); square.increaseTwice();
Swipe to show code editor
Let's place our Figures in the boxes. Add to the parent's class function box()
, which outputs the message I am a Rectangle, and I need a box of size
won
h, where w and h are width and height of the current Rectangle. Then override this function in Square
class, so it outputs the message: I am a Square, and I need a box of size
son
s, and s is a length of square's side.
Create Rectangle
and Square
objects and call box()
method for them.
Overriding attributes
Inside the daughter's class, we can refer to any attributes and methods of the parent's class. In general, there is no sense to override attributes because you can refer them directly from the parent's class. The exception is private attributes: they are accessible only inside the current class, that's why you can't override them.
¡Gracias por tus comentarios!