I have two classes in javascript a, b. Class b extends a. Class a calls method in constructor. I wanna override this method in b class. How to call overridable method? when I added to class a, to constructor this.method(), it always calls method from a class.
class a {
constructor() {
this.method();
}
method() {
alert("a");
}
}
class b extends a {
constructor() {
super();
}
method() {
alert("b");
}
}
If you don't know in advance whether the instance is of the subclass or superclass, you can make sure the superclass calls its own method by having the superclass reference itself explicitly:
A.prototype.method.call(this);
class A {
constructor() {
A.prototype.method.call(this);
}
method() {
console.log("a");
}
}
class B extends A {
constructor() {
super();
}
method() {
console.log("b");
}
}
const b = new B();
class A {
constructor(){
this.method()
}
method(){
alert("a");
}
}
class B extends A {
constructor(){
super()
}
method(){
alert("b");
}
}
new B();
Related
Wonder if anyone can help?
I'm trying to call a parent's constructor or at a minimum get a reference to the parent class in some way without hardcoding anything.
class A {
static foo(options) {
parent::__construct(options); <- this is how you would get the parent in php
}
}
class B extends A {
}
Is this possible?
In a javascript class (and OOP in general), a static method is not part of an instance and therefore the object it resides in does not have a constructor.
You should avoid using static method for this sort of thing and use a standard constructor and call super() to call the parent constructor.
class A {
constructor(options) {
console.log('Options are:');
console.log(options);
}
}
class B extends A {
constructor(options) {
super(options);
}
}
const item = new B({item1: 'abc'});
Further reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/super
You can use super() to call parent constructor
class A {
constructor() {
console.log('I\'m parent ');
}
foo(){
console.log('Class A: Called foo');
}
}
class B extends A {
constructor() {
super();
}
foo(){
super.foo()
}
}
const b = new B();
b.foo();
Let's say I have a superclass and a child that overrides one of the super methods.
class Test {
doSomething() {
callsomething({
callback: this.method
})
}
method() {
console.log('parent');
}
}
class A extends Test {
constructor() {
super();
}
method() {
console.log('override');
}
}
new A().method();
There is a way to know inside the Test class if method was overridden?
Inside doSomething, check if this.method refers to Test.prototype.method - if it doesn't, then this.method refers to something else, which means it's been shadowed, quite possibly by a child class method:
class Test {
doSomething() {
if (this.method === Test.prototype.method) {
console.log("Method is native Test's!");
} else {
console.log("Method is not Test's, it's been shadowed!");
}
}
method() {
console.log('parent');
}
}
class A extends Test {
constructor() {
super();
}
method() {
console.log('override');
}
}
new A().doSomething();
new Test().doSomething();
You can also do the same check in Test's constructor:
class Test {
constructor() {
if (this.method === Test.prototype.method) {
console.log("Method is native Test's!");
} else {
console.log("Method is not Test's, it's been shadowed!");
}
}
method() {
console.log('parent');
}
}
class A extends Test {
constructor() {
super();
}
method() {
console.log('override');
}
}
new A()
This doesn't work. Is there a way for a child class in JS to have access to its parents static methods?
class Person {
constructor() {}
static isHuman() {
return 'yes I am';
}
}
class Brian extends Person {
constructor() {
super();
}
greeting() {
console.log(super.isHuman())
}
}
const b = new Brian();
b.greeting();
Yes you can. You can use super but to get at the static method you have to access the constructor property of it:
super.constructor.isHuman()
You can also use the class name directly:
Person.isHuman();
//this works because Brian inherits the static methods from Person
Brian.isHuman();
Or by going up the prototype chain
//would be referencing Brian
this.constructor.isHuman();
//would be referencing Person
this.__proto__.constructor.isHuman();
Object.getPrototypeOf(this).constructor.isHuman();
Demo
class Person {
constructor() {}
static isHuman() {
return 'yes I am';
}
}
class Brian extends Person {
constructor() {
super();
}
greeting() {
console.log("From super: ", super.constructor.isHuman())
console.log("From class name (Brian): ", Brian.isHuman())
console.log("From class name (Person): ", Person.isHuman())
console.log("From prototype chain: ", this.constructor.isHuman())
console.log("From prototype chain: ", Object.getPrototypeOf(this).constructor.isHuman())
}
}
const b = new Brian();
b.greeting();
For static methods, use the class name rather than super.
class Person {
constructor() {}
static isHuman() {
return 'yes I am';
}
}
class Brian extends Person {
constructor() {
super();
}
greeting() {
console.log(Person.isHuman())
}
}
const b = new Brian();
b.greeting();
I have three classes, two of them extending the third. Is it possible to somehow (different than manually) assign extending classes' names to the super constructor?
class Master {
constructor(options) {
this.methods = Object.getOwnPropertyNames( Master.prototype );
}
getMethods() {
return Object.getOwnPropertyNames( Master.prototype );
}
}
class SlaveOne extends Master {
constructor(options) {
super(options);
}
methodOne() {}
methodTwo() {}
}
class SlaveTwo extends Master {
constructor(options) {
super(options);
}
methodThree() {}
methodFour() {}
}
So, what I want is to have either method or this.methods assignment in the Master class, which will:
return ['constructor', 'methodOne', 'methodTwo'] when called on an instance of SlaveOne;
return ['constructor', 'methodThree', 'methodFour'] when called on an instance of SlaveTwo;
My current code will return same ['constructor', 'getMethods'] when called either on instance of SlaveOne, SlaveTwo or Master. Any ideas?
Something like this should do the trick
class Master {
getMethods() {
return Object.getOwnPropertyNames( this.constructor.prototype );
}
}
class SlaveOne extends Master {
constructor(options) {
super(options);
}
methodOne() {}
methodTwo() {}
}
class SlaveTwo extends Master {
constructor(options) {
super(options);
}
methodThree() {}
methodFour() {}
}
console.log(new SlaveOne().getMethods(), new SlaveTwo().getMethods())
class PathController {
constructor(){
}
getMainPage(){
alert("getMainPage");
}
setPushState(){
alert("setPushState");
}
}
class MainMenu extends PathController {
constructor (){
// call my PathController here
super();
getMainPage();
setPushState();
}
}
let aMainMenu = new MainMenu();
my intention is to call my getMainPage and setPushState at my MainMenu constructor , i tired this.getMainPage and this.setPushState and it is not working as well. can anyone tell me how to call it ?
Your super is your "this" since we are currently in the constructor. Here's how it should look:
class PathController {
constructor(){
}
getMainPage(){
alert("getMainPage");
}
setPushState(){
alert("setPushState");
}
}
class MainMenu extends PathController {
constructor (){
// call my PathController here
super();
super.getMainPage();
super.setPushState();
}
}
let aMainMenu = new MainMenu();
However once you are outside of the constructor, then you would use "this.getMainPage();"
One approach would be to pass property names to super() which call the functions at PathController parent constructor
class PathController {
constructor(fromMainMenu, ...props) {
if (fromMainMenu) {
for (let fn of props) {
this[fn]()
}
}
}
getMainPage(){
alert("getMainPage");
}
setPushState(){
alert("setPushState");
}
}
class MainMenu extends PathController {
constructor () {
// call my PathController here
super(true, "getMainPage", "setPushState");
}
}
let aMainMenu = new MainMenu();