函数执行完成后如何调用函数？ - JavaScript

Question

我正在使用一个用户控件，该控件具有一组在执行操作时调用的 JavaScript 函数。该用户控件在应用程序的很多地方使用。

当内置 JS 函数之一完成执行时，我需要在页面上触发自定义 JS 函数。

有没有办法让我附加一个函数，当另一个函数完成执行时要触发该函数？我不想更新内置的 JS 函数来调用此页面的 JS 函数。

希望这是有道理的。

Answer 1

最丑陋和最好的解决方案是对内置函数进行猴子修补。假设内置函数称为“thirdParty”：

// first, store a ref to the original
var copyOfThirdParty = thirdParty;
// then, redefine it
var thirdParty = function() {
    // call the original first (passing any necessary args on through)
    copyOfThirdParty.apply(this, arguments);
    // then do whatever you want when it's done; 
    // custom code goes here
    customFunction();
};

我们实际上创建了内置函数的修改版本，而没有触及原始版本。

Answer 2

由于 Javascript 是高度动态的，您可以修改原始函数而无需修改其源代码：

function connect_after(before, after){
    return function(){
        before.apply(this, arguments);
        after();
    };
}

var original_function = function(){ console.log(1); }
original_function = connect_after(original_function, function(){ console.log(2); })

Answer 3

您可以使用几种设计模式来实现此目的，具体取决于特定代码（您尚未共享的代码）以及可以更改和不能更改的内容：

添加回调：

function mainFunction(callbackWhenDone) {
    // do other stuff here
    callbackWhenDone();
}

选项 1：向某些现有代码 ，您可以使用以下方式调用它：

mainFunction(myFunction);

选项 2：包装以前的函数：

obj.oldMethod = obj.mainFunction;
obj.mainFunction = function() {
    this.oldMethod.apply(this, arguments);
    // call your stuff here after executing the old method
    myFunction();
}

因此，现在任何时候有人这样做：

obj.mainFunction();

它都会调用原始方法，然后调用您的函数。

Answer 4

您基本上是在尝试进行回调。由于您没有提及您正在谈论的函数（如代码中所示），因此最好的办法基本上是包装该函数（快速而肮脏）并使其与回调一起使用。

这样你就可以向它传递一个 Lambda（匿名函数）并在完成后执行你想要的任何操作。

更新以演示如何添加回调：

function my_function($a, $callback) {
   alert($a);
   $callback();
}

my_function('argument', function() { 
  alert('Completed');
});