javascript – jquery oop覆盖方法的功能

前端之家收集整理的这篇文章主要介绍了javascript – jquery oop覆盖方法的功能前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
嗨,我想知道如果我的方法声明如下,我如何覆盖方法函数
(function ($) {
    $.extend({
        tablesorter: new
        function () {
            function buildHeaders(table) {
                console.log('ORIGINAL HEADERS');
            }

            this.construct = function (settings) {
                return this.each(function () {
                    $headers = buildHeaders(this);
                });
            }
        }
    });

    $.fn.extend({
        tablesorter: $.tablesorter.construct
    });
})(jQuery);

我的目标是完全重写tablesorter buildHeaders函数.

(function ($) {
    var originalMethod = $.fn.tablesorter;
    $.fn.tablesorter = function() {
        console.log('overiding');

        function buildHeaders(table) {
            console.log('OVERRIDE HEADERS');
        }
        originalMethod.apply(this,arguments);
    }
})(jQuery);

这不工作…任何帮助将是伟大的.谢谢!

解决方法

简答:不,你不能.

函数内部函数(即buildHeaders是另一个函数内的函数)是私有的,不能被覆盖.以这个简单的例子来猜测输出

// A very simple function inside a function
test = function() {
  function buildHeaders() {
    alert("original buildHeaders called");
  }

  buildHeaders();
}

// Now lets take a backup of the "test" function
oldTest = test;

// And try to override a private function
test = function() {
  function buildHeaders() {
    alert("duplicate buildHeaders called");
  }

  oldTest.apply(this,arguments);
}

// Call
test();

Guess the output?

为什么?

我认为你正在从Java(或类似的)背景中尝试这个,你可以覆盖实际的方法.在Javascript中,不要覆盖函数,而是替换它们.即

function x() { }    // Original function
oldX = x            // Original function is now oldX
x = function() { }  // x is now a **NEW** function
                    // we did not override,we replaced

// At this point,oldX and x are two different functions
// You just swapped their names,but x is no longer the original x

这部分很清楚.现在到第二部分,私人/本地变量:

function x() {
  var y = 0;
}
x();
alert(y); // No,you cannot access "y" from outside

但我们来吧

function x() {
  y = 0;  // Without "var"
}
x();
alert(y); // Alerts "0"!!

如果给出var y = 0,那么该函数就变成私有的.如果不这样做,它将变成全局范围的(技术上限,但现在让我们离开).

第三部分,函数内部的函数默认是私有的.按照同一个例子,

function x() {
  function y() { }
  // this is the same as saying:
  var y = function() { }
  // note "var y",so you can't override this from outside
}

因此,如果通常在函数中定义函数,如函数x(){function y(){}},则y对x是私有的.与你配合可以永远不会覆盖JavaScript中的一个功能,只能替换.所以你永远无法访问或修改y,除了原来的x函数之外.

唯一的选择

只有在您有权访问该功能时,才可以使用自定义实现替换功能.所以你必须编辑原来的功能,或者某种方式你必须保存对函数之外的buildHeaders的引用.即您必须执行以下操作之一:

// ...
tablesorter: new function() {
  this.buildHeaders = function() { }
  // ...
}

// and later,you can replace this:
tablesorter.buildHeaders = function() { // alternative code }

您将能够覆盖该功能,因为它不是私有的,并且您有一个句柄来访问它.

编辑:次要语法

猜你在找的jQuery相关文章