事件是如何传递给javascript方法的

How is an event passed to a javascript method?

本文关键字:javascript 方法 何传递 事件      更新时间:2023-09-26

关于如何用javascript传递"人工"事件,有几个答案。

我不明白的是,传递给方法AND的事件是如何通过直接使用"event"变量来访问的,即使它似乎没有在任何地方声明。

有人能解释一下吗?

提前感谢

这里有一个基本的事件侦听器:

class EventCaller {
    constructor() {
        this.listeners = [];
    }
    addListener(obj) {
        if (obj.trigger) { this.listeners.push(obj); }
    }
    trigger(event, ..data) {
        this.listeners.forEach((listener) => listener.trigger(event, ...data));
    }
}
class EventListener {
    constructor() { this.eventsListeningTo = []; }
    listenTo(item) {
        if (!item.addListener) { throw new Error('Cannot add listener error'); }
        item.addListener(this);
    }
    trigger(event, ...data) {
        if (this[`on${event}`]) {this[`on${event}`](...data)}
    }
    onFoo({bar, foo}) {
       console.log(bar, foo);
    }
}

然后作为一个例子,您可以创建一个EventCaller:

const eventAgg = new EventCaller();

然后创建几个事件侦听器

const a = new EventListener();
const b = new EventListener();

然后a和b可以监听eventAgg事件

a.listenTo(eventAgg);b.listenTo(eventAgg);

所以如果我现在触发

eventAgg.trigger('Foo', {bar: 'lemons', foo: 42});

现在ab都将控制台注销lemons, 42,因为它们都在侦听该伪事件。


这只是基础。jquery、Backbone、angular等都以不同的方式实现了这一点(我相信),但这一切都归结为回调(甚至是新代码中的Promises)