javascript - 在 Javascript ES6 的子类中扩展父类方法

标签 javascript oop inheritance ecmascript-6

我想在父类中扩展子类的特定方法的功能。我还在习惯 ES6 中的 OOP,所以我不确定这是否可行或违反规则。

我正在寻找这样的东西:

class Parent {
  constructor(elem) {
    this.elem = elem;

    elem.addEventListener((e) => {
      this.doSomething(e);
    });
  }

  doSomething(e) {
    console.log('doing something', e);
  }
}

class Child extends Parent {
  constructor(elem) {
    // sets up this.elem, event listener, and initial definition of doSomething
    super(elem)
  }

  doSomething(e) {
    // first does console.log('doing something', e);
    console.log('doing another something', e);
  }
}

本质上,我想在父方法上附加一个子特定的回调。有没有一种创造性的方法可以在不创建具有相同功能的全新类的情况下做到这一点?

最佳答案

你可以在方法中使用super:

doSomething(e) {
  super.doSomething(e)
  console.log('doing another something', e)
}

this 在子类和父类中是一回事,指的是实际对象,所以如果你在父类代码中调用一个方法,它会调用子类的实现,如果确实是一个 child 。同样适用于其他语言,例如 Python 和 Ruby。

工作代码:

class Parent {
  constructor(elem) {
    this.elem = elem
    this.elem.addEventListener('click', (e) => { this.doSomething(e) })
  }

  doSomething(e) {
    alert('doing something')
  }
}

class Child extends Parent {
  constructor(elem) {
    super(elem)
  }

  doSomething(e) {
    super.doSomething(e)
    alert('doing another something')
  }
}

let child = new Child(document.getElementById('button'))
<button id="button">Alert</button>

关于javascript - 在 Javascript ES6 的子类中扩展父类方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46244417/

相关文章:

matlab - 如何获取MATLAB类中的静态成员变量?

c# - 派生类中方法的选择性可访问性

javascript - 引用错误: _ref2 is not defined @ react-dom. production.min.js

php - MVC + Service Layer 在 zend 或 PHP 中常见吗?

javascript - 在页面加载时打开 javascript 模式

oop - 如何在 julia 中创建一个 "single dispatch, object-oriented Class",其行为类似于具有公共(public)/私有(private)字段和方法的标准 Java 类

asp.net-mvc-3 - 如何将 asp.net MVC 脚手架与从 dbcontext 向下两个子类的上下文一起使用

c++11 - 从参数包中的基类继承构造函数

javascript - Fittext 不适用于 WordPress 帖子

javascript - 执行文件太多次?