3、写一下消息订阅模式的代码 · 大厂前端面试真题

>[danger]写一下消息订阅模式的代码消息订阅模式，也称为发布-订阅模式，是一种用于组件之间通信的设计模式。它允许一个组件（发布者）发布消息，而其他组件（订阅者）可以订阅并接收这些消息。下面是一个简单的JavaScript代码示例，演示了如何实现消息订阅模式： ``` // 创建一个全局的消息订阅器 const eventEmitter = { // 存储事件及其对应的回调函数 events: {}, // 订阅事件 subscribe: function (eventName, callback) { if (!this.events[eventName]) { this.events[eventName] = []; } this.events[eventName].push(callback); }, // 取消订阅事件 unsubscribe: function (eventName, callback) { if (this.events[eventName]) { this.events[eventName] = this.events[eventName].filter(fn => fn !== callback); } }, // 发布事件 publish: function (eventName, data) { if (this.events[eventName]) { this.events[eventName].forEach(callback => { callback(data); }); } } }; // 创建订阅者 function subscriber1(data) { console.log('Subscriber 1 received data:', data); } function subscriber2(data) { console.log('Subscriber 2 received data:', data); } // 订阅事件 eventEmitter.subscribe('messageEvent', subscriber1); eventEmitter.subscribe('messageEvent', subscriber2); // 发布事件 eventEmitter.publish('messageEvent', 'Hello, subscribers!'); // 取消订阅 eventEmitter.unsubscribe('messageEvent', subscriber1); // 再次发布事件 eventEmitter.publish('messageEvent', 'Another message'); ``` 在上面的代码中， - eventEmitter对象充当全局的消息订阅器，可以让不同部分的代码进行事件的发布和订阅。 - subscribe 方法用于订阅事件， - unsubscribe 用于取消订阅 - publish 用于发布事件。 - 两个订阅者 subscriber1 和 subscriber2 订阅了名为 'messageEvent' 的事件，并在事件发布时执行相应的回调函数。这个示例演示了如何使用消息订阅模式来实现组件之间的松散耦合，以便它们可以相互通信而无需直接引用彼此。这对于实现事件驱动的架构非常有用。