Question

问候，我试图在mootools中覆盖或扩展Element.show（）和.hide（）方法，以便添加一些WAI-Aria切换。我试图使用像这样的Class.Refactor（）方法：

 Element = Class.refactor(Element, {

 show: function(displayString) {
   result = this.previous(displayString);
   // Do my thing
   return result;
 },

 hide: function() {
   result = this.previous();
   // Do my thing
   return result;
 }

});

然而，这不起作用，之前是null，我认为原因是Mootools通过Element.implement注入这些方法。那么这些方法不是原生的吗？

我已经想出如何完全替换.show和.hide但是我想保留他们现有的所有功能并添加它。有任何想法吗？

Answer 1

我自己不是一个重构家伙，但你总是可以做'老派'并将之前的函数保存在变量（例如_prev_show和_prev_hide）中，然后执行覆盖并调用那些来自新方法的功能。

第二个选项是尝试将Element扩展到自身并调用this.parent()，这是Class.Refactor的“不安全”版本。 [reference]

Answer 2

我从一位同事那里得到了答案。他不是这样，所以我代表他发帖，下次我们在同一个城市时会给他买啤酒：

Class.refactor不适用于Natives（Element，Array，String等）因为他们不是班级，他们也不能被压倒; MooTools 添加一些很酷的原型，使它们更像类，有趣和容易与之合作。

扩展native的方法是使用implement（）方法;唯一的问题是this.parent（）和this.previous（）不存在，所以你必须得到一个更难以扩展现有方法而不重写它们：

(function(){ // Keeps the window namespace clean

   var old_hide = Element.prototype.hide;
   var old_show = Element.prototype.show;

   Element.implement({
       hide: function() {
           result = old_hide.run(arguments, this); // Calls old method
           alert("Hiding " + this.get('tag') );
           return result;
       },
       show: function(display) {
           result = old_show.run(arguments, this); // Calls old method
           alert("Showing " + this.get('tag') );
           return result;
       }
   });

})(); // Closes the private function and executes it immediately

这里的关键概念是：

1 - 将整个shebang封装在一个私有的，自执行的函数中全局命名空间不受我们的变量赋值的污染原始方法（例如old_hide和old_show）;

2 - 使用Native对象的implement（）方法覆盖每个函数，就像你作为Class.refactor的第二个参数一样;

3 - 而不是在每个方法中调用this.parent（）或this.previous（）使用MooTools的run（）方法调用旧原型，该方法通过了带有绑定到函数的参数并执行它。

和以前一样，确保收集function.run（）调用的结果返回它以保持API一致性。

Answer 3

关于ryber的最后一条评论，我很困惑，因为我编写了一个例子是jsFiddle重构Element类（Sample）。诀窍在于，当我尝试在实际应用程序中使用该示例时，它不起作用，我最终在这里寻找原因。

以前用工具注入的重构方法

3 个答案: