复杂原型JavaScript中的重写功能

Question

I'm a bit stuck on a problem which I can't solve, I performed investigation on internet and on this site, but I can't find the answer to my question.

So basically I have a javascript file, which I cannot modify, so I have another javascript file which should catch the method when it is called and override it.

Normally I know how it works and I already done the function overriding, but I don't know how to solve this issue.

I have a very big script, but I will show just a small piece of it:

Microsoft.Office.Server.Ajax.NavResizer.prototype = {
    $6: null,
    $7: null,
......
$20:function ($p0) {
    if (this.$1E) {
        $p0.preventDefault();
    } 
},
$21: function ($p0) {
    var $0 = $p0.target;
    this.$1F = ($0 === this.$A);
    if (this.$1F || $0 === this.$B) {
        this.$1E = $0;
        this.$18 = $p0.clientX;
        this.$19 = $p0.clientY;
        Sys.UI.DomEvent.removeHandler(this.$1E, 'mousedown', this.$12);
        var $1 = document.body; Sys.UI.DomEvent.addHandler($1, 'mouseup', this.$13);
        Sys.UI.DomEvent.addHandler($1, 'mousemove', this.$14);
        $1.style.cursor = (this.$1F) ? 'e-resize' : 'n-resize';
        this.$1A = this.get_$42();
        this.$1B = this.get_$43();
        $1.focus();
        Sys.UI.DomEvent.addHandler($1, 'selectstart', this.$15);
        $p0.preventDefault();
    } 
},
$22: function ($p0) {
    this.$34($p0);
    var $0 = document.body;
    Sys.UI.DomEvent.removeHandler($0, 'mouseup', this.$13);
    Sys.UI.DomEvent.removeHandler($0, 'mousemove', this.$14);
    Sys.UI.DomEvent.addHandler($0, 'selectstart', this.$15); 
    $0.style.cursor = 'default';
    Sys.UI.DomEvent.addHandler(this.$1E, 'mousedown', this.$12);
    this.$1E = null;
},
$23: function ($p0) {
    this.$34($p0);
},
$24: function ($p0) {
    this.$26();
},
....

Basically this is the part of the script: so lets say I want to override function: $22: function ($p0) in the script in another javascript file, how do i do that?

I would appreciate any help.

A small update, some good examples were provided but they are not working. The environment where i run this sript is SharePoint, normally when I did override I used this method:

var oldFixRibbonAndWorkspaceDimensions = window.FixRibbonAndWorkspaceDimensions;
window.FixRibbonAndWorkspaceDimensions = function () {
    this.MyFixRibbonAndWorkspaceDimensions();
};

function MyFixRibbonAndWorkspaceDimensions(){...}

And it didn't matter when i load the script as this function was only called when the default function was called not before not after. Just in the same time. But with the example which were provided here, the function is trying to execute on the document.ready()

Answer 1

You want to permanently override it? Just do this:

Microsoft.Office.Server.Ajax.NavResizer.prototype.$22 = function($p0) {
    // your code.
};

As long as your script is executed after the original is defined, you're good.

Answer 2

Old post.. but this works for me:

ExecuteOrDelayUntilScriptLoaded(overrideNavResizer, "NavResizer.js");

function overrideNavResizer(){

    Microsoft.Office.Server.Ajax.NavResizer.prototype.$22 = function($p0) {
    // your code.
};
}

Answer 3

在您的新脚本中：

Microsoft.Office.Server.Ajax.NavResizer.prototype.$22 = function () {//your function code}

Answer 4

Assuming you have access to the prototype object (it's in global scope) and your scripts runs after it, that is easy:

var proto = Microsoft.Office.Server.Ajax.NavResizer.prototype,
    oldMethod = proto.$22;
proto.$22 = function newMethod(args, …){
    …
};