js代码-蚂蚁金服前端面试题 // 题目 4：实现一个基本的 event-emitter。 class EE { ...

在JavaScript编程中，EventEmitter（事件发射器）是一种常见的设计模式，它允许对象在特定时刻发出事件，并让其他部分的代码订阅这些事件以作出响应。这个模式在许多库和框架中都有应用，如Node.js的EventEmitter类和浏览器中的CustomEvent接口。在蚂蚁金服前端面试题中，题目要求实现一个基本的EventEmitter类，包含`emit`、`once`、`on`和`off`四个方法。接下来，我们将详细讨论这些方法的功能和实现原理。 1. `emit(name, ...params)`：此方法用于触发一个指定的事件，`name`参数是事件名，`...params`是传递给事件处理函数的参数。实现时，我们需要遍历存储事件和其对应处理函数的数据结构（通常是对象或映射），调用这些处理函数并将`params`传递给它们。 2. `once(name, func)`：此方法允许添加一个只执行一次的事件监听器。当事件被触发后，监听器会被自动移除。实现时，我们可以创建一个新的包装函数，该函数在内部调用用户提供的`func`，并在执行后自动将其从事件列表中删除。 3. `on(name, func)`：此方法用于注册一个事件监听器，当指定的事件发生时，`func`将被调用。通常，我们需要将事件名和处理函数保存在一个对象中，以便于后续的`emit`和`off`操作。 4. `off(name, func)`：此方法用于移除已注册的事件监听器。根据`name`和`func`，我们从存储的事件列表中找到对应的处理函数并移除。如果`func`未提供，那么所有与`name`匹配的监听器都将被移除。 以下是一个简单的EventEmitter实现： ```javascript class EE { constructor() { this._events = {}; } emit(name, ...params) { if (this._events[name]) { this._events[name].forEach(func => func(...params)); } } once(name, func) { const wrapper = (...args) => { func(...args); this.off(name, wrapper); }; this.on(name, wrapper); } on(name, func) { if (!this._events[name]) { this._events[name] = []; } this._events[name].push(func); } off(name, func) { if (this._events[name]) { if (func) { this._events[name] = this._events[name].filter(_func => _func !== func); } else { delete this._events[name]; } } } } ``` 在这个实现中，`_events`对象存储了所有的事件和对应的处理函数。`emit`通过遍历`_events`调用每个处理函数。`once`创建了一个包装器函数，确保在执行后会自动移除。`on`和`off`分别用于添加和移除监听器，`off`提供了移除单个或全部匹配事件监听器的功能。 理解并能实现这样的EventEmitter是前端开发者必备的技能之一，因为它是构建可复用、模块化和解耦代码的关键工具。在实际项目中，EventEmitter常用于组件通信、状态管理等多种场景。