0

我正在尝试理解 Javascript OOP。我正在尝试覆盖类中的方法。当“点击”时，该类具有默认功能。我想覆盖那个函数，所以当点击时会发生一些新的事情。

我有一个 Javascript 类，如下所示：

AlertModal = function(){
  var x = *this is my close object;

  x.onclick = destoryAlert;

  function destroyAlert(){
    console.log('destroy');
  }
}

我的 HTML 文件显示：

<script type="text/javascript">
  window.alert = function (message) {
    var newAlert = new AlertModal();
    newAlert.destroyAlert = function(){
      console.log('new alert destroy');
    };

    newAlert.destroyAlert();
  };

我得到“新警报销毁”，这很棒。但是当我单击“x”时，它也表示销毁。所以它被覆盖了，但不是？！就像它在调用时创建了一个新的“destroyAlert”函数，但保留了默认值。

谁能告诉我如何做到这一点，创建一个具有默认功能的类，但如果需要如何覆盖它？

我习惯于用 Java 和 Actionscript 进行编程，扩展类和覆盖公共/受保护的方法，但是这样做 Javascript 似乎有很大不同，我无法理解这样做的逻辑。

谢谢，

4

2 回答 2

1

您可以覆盖实例级别的方法：

AlertModal = function() {
    this.init();
};

AlertModal.prototype.init = function() {
    var modal = this;
    var x = ...;
    x.onclick = function() {
        // Note that I'm not using `this` here, because it would
        // reference `x` instead of the modal. But we can pass the modal
        // from the outer scope. This is called a lexical closure.
        modal.destroy();
    };
};

AlertModal.prototype.destroy = function() {
    console.log('destroy');
};

var myalert = new AlertModal();
myalert.destroy = function() {
    console.log('new destroy');
};

myalert.destroy();

但是，如果您想在多个地方执行相同的覆盖，最好通过从 AlertModal 类继承来创建一个专门的 OtherAlertModal。这是一个在 JavaScript 中继承的好方法：http: //ejohn.org/blog/simple-javascript-inheritance/

于 2012-09-04T17:55:24.720 回答
0 
x.onclick = destroyAlertl

将 x 的onclick处理程序设置为引用本地函数

然而

newAlert.destroyAlert = ...

将此对象的destroyAlert属性集设置为不同的函数。它不会更改存储在x.onclick.

您需要将“默认”功能放在以下prototype位置AlertModal：

AlertModal.prototype.destroyAlert = function() {
     ...
}

并以不同的方式注册处理程序：

var self = this;
x.onclick = function() {
    self.destroyAlert();
}

如果您随后覆盖此类对象的destroyAlert属性，则将调用新函数。

于 2012-09-04T17:30:16.033 回答