JavaScript .on() 方法是如何定义的？

Question

在 jQuery 库中，该函数不存在，但每个 jQuery 对象都有这些基本方法。在另一个线程中，有人说 .on() 属于节点 API，这让我很困惑，因为它可以在前端使用，我什至不需要包含const EventEmitter = require('events');，jquery.min.js 也不需要包含. 我只想了解为什么例如字符串“click”或“mouseover”是有效参数。

此外， on() 方法广泛使用回调函数。例如： $('class').on('click', event => {...})

我想了解为什么可以如上所述传递 lambda 函数或“事件”。

此外，有些人可能会发现以下资源很有用，但是，它并不是那么简单，让我想出了比答案更多的问题：https : //nodejs.org/docs/latest/api/events.html

Answer 1

on方法注册一个处理程序，它是具有特定签名的回调函数。一旦触发事件，就会调用处理程序。它接收必要的数据作为函数参数（通常是event对象）。

jQuery 和 Node 事件发射器没有任何关系，它们都有on方法，因为它是添加事件处理程序的方法的常规方式。

一个简单的实现，展示了它是如何工作的：

const emitter = {
  handlers: {},

  on(eventName, handler) {
    if (!this.handlers[eventName])
      this.handlers[eventName] = [];

    this.handlers[eventName].push(handler);
  },

  emit(eventName, data) {
    for (const handler of this.handlers[eventName])
      handler(data);
  }
};

emitter.on('foo', data => console.log(data.text));

emitter.emit('foo', { text: 'Foo event triggered' });