JS中调用函数的事件是什么？

Question

在调用时，将一个函数绑定到另一个函数上是否可行？例如，它可能会像这样进行：

function a(){...}
function b(){...}
b.bind("onInvoke","a");

当调用b时，a也会自动被调用。

---

编辑：好的，为了澄清，这不是一个有关链式调用的问题。这个想法是找到一种优雅的方式来绑定事件。观察使用普通函数回调的正常“非优雅”方式：

function handler(){...}
function caller1(){handler(); ...}
function caller2(){handler(); ...}
function caller2(){handler(); ...}
// More callers all over your website everywhere else

这样做没问题吧？但是如果我有很多地方都调用了，那么组织和修改起来就很困难。

现在看看更好的解决方案！（如果有的话）

function handler(){...}
// Caller make no reference to handler on creation
function caller1(){...}
function caller2(){...}
function caller3(){...}
// Caller function are still all over the place, all over your website
// Event handler registered later in one location here, doesn't matter where they are phsically
caller1.bind("onInvoke",handler);
caller2.bind("onInvoke",handler);
caller3.bind("onInvoke",handler);

非常类似于普通的HTML-JQuery事件注册。你不需要在用户可能会点击的每张图片上都写onClick（这样做太麻烦了！），只需编写一个简单的代码即可。

 $("img").bind("onClick",click_handler);

针对整个网站。这就是我要寻找的主要内容，除了JS功能之外。

希望这可以澄清问题。

---

编辑2：需要与IE7配合使用！！！JavaScript 1.8.5很棒，但目前没有支持它的东西。

- Bill Software Engineer

---

可能是Can I intercept a function called directly?的重复问题。 - Andy E

@AndyE 我的感觉是，OP更关心的是自动按顺序调用函数的解决方案。 - Peter

@Peter：我不是很确定。"所以当调用b时，a也会自动被调用"—— 潜在的执行顺序可能有所不同（例如，该问题可能希望在b之后调用a），但是两个问题之间的前提似乎是相同的；“当调用一个函数时，调用另一个函数”。我可能错了，但这取决于发帖者清楚地区分这两个问题 :-) - Andy E

@AndyE，当然，我同意原帖作者应该澄清！我只是从他的bind示例中得到了那种感觉。即便如此，那个问题很可能也是一个重复的问题:D - Peter

对于那些稍后阅读此内容的人。Adam Rackis和Simon的解决方案似乎都可以工作。Simon的解决方案更优秀，因为它允许绑定多个函数。 - Bill Software Engineer

Answer 1

你可以采用面向方面的方法来完成这个任务。以下是一个简单的例子：

将函数a()与函数b()关联起来：

var _b = b;
b = function(){
   _b();
   a();
}

现在调用b()函数：

b();

在这里查看它的实际效果：http://jsfiddle.net/eZ9wJ/

- Simon

---

在这个例子中，b是一个全局变量。你应该总是使用var来定义变量； - Wojciech Bednarski

我正在覆盖Yongke在他的问题中定义的全局函数b()的引用。要在任何对b()的调用中调用函数a()，必须在定义原始函数的相同作用域中覆盖它。当然，这只是一个简化的例子。在实际示例中，我不建议在全局范围内定义函数。 - Simon

这里需要记住的一件事是，最初持有对b引用的任何对象都不会被更新；因此，这种方法可能会出现问题。需要强调的是，即使我们将其存储在原始变量中，我们仍然在调用新函数。 - Peter

嗨，Simon，不错的解决方案，你能否将所有内容包装在一个方便的“bind”函数中，或者在这种设置下不可能吗？ - Bill Software Engineer

使用闭包，您可以创建一个非常接近方便的绑定函数的东西：http://jsfiddle.net/WQn6p/。这个 fiddle 还展示了如何将参数传递给绑定函数。 - Simon

Answer 2

根据您想要进行的架构程度，有各种不同的解决方案。一个简单而灵活的方法是创建一个链接实用函数：

function chain() {
   var args = arguments;
   return function() {
      // loop through arguments and invoke all functions
      for(var i = 0; i < args.length; i++) {
         if(typeof args[i] == "function")
            args[i]();
      }
   }
}

这段代码返回一个新函数，该函数将按顺序调用提供的函数。使用方法如下：

var myChain = chain(b, a);
myChain();

- Peter

---

嗨，彼得，这个解决方案对于链接很好，但在我目前的情况下没有用。 - Bill Software Engineer

@YongkeBillYu：实际上，这确实解决了你的问题。只需执行caller1 = chain(handler, caller1)即可。 - hugomg

Answer 3

JavaScript 1.8.5 / ECMAScript 5确实定义了bind函数，但它并不像你上面描述的那样工作；它允许你在调用时指定this上下文，并且可选地允许你硬编码某些参数——柯里化。

- Adam Rackis

---

我认为目前浏览器对 JS 1.8.5 的支持不算太好，对吗？ - Bill Software Engineer

Answer 4

你可以使用回调函数：

function a(){
  // some code here
  b();
}
function b(){...}

或者观察者模式 - http://www.michaelhamrah.com/blog/2008/12/event-pooling-with-jquery-using-bind-and-trigger-managing-complex-javascript/

- Wojciech Bednarski

---

使用这段代码，this的引用和函数参数都不会被保留。 - Rob W