【设计模式】当发布订阅遇上Promise

最新推荐文章于 2023-08-15 22:02:41 发布

AsnLee

最新推荐文章于 2023-08-15 22:02:41 发布

阅读量491

点赞数

分类专栏： JS 文章标签： javascript es6 vue.js

本文链接：https://blog.csdn.net/qq_41597258/article/details/115377931

版权

本文探讨了发布-订阅模式与Promise在JavaScript中的结合应用。通过简单的实现示例，解释了如何使用Promise来管理订阅者和发布者的交互，详细阐述了Promise的构造函数、resolve和reject函数以及then方法的工作原理。同时，梳理了Promise执行的调用栈顺序，并提供了相关学习资源。

摘要由CSDN通过智能技术生成

在这里插入图片描述

Write Less & Do More

发布-订阅模式是一种对象间一对多的依赖关系，当一个对象的状态发送改变时，所有依赖于它的对象都将得到状态改变的通知。

简单点就是收集依赖 => 触发通知 => 取出依赖执行

而 Promise 是 JS 异步编程中的重要概念，异步抽象处理对象，是目前比较流行 Javascript 异步编程解决方案之一，示例如下

new Promise((resolve, reject) => {
   
  resolve('fulfilled')
}).then(console.log) // => 'fulfilled'

拆分如下：订阅者（then）把订阅的事件 (console.log) 注册到调度中心（Promise），当发布者（resolve, reject）发布该事件到调度中心，该事件触发时由调度中心统一调度订阅者注册到调度中心的处理代码, 输出 ‘fulfilled’。

简单实现

Promise构造函数用来声明示例对象，需要传入一个执行器函数。其中包括 resolve 函数和 reject 函数，以及几个重要的属性：状态属性、结果属性和回调函数队列。

function _Promise(executor) {
   
  const context = this

  // 初始化
  this.state = 'pending'
  this.result = null
  this.callBacks = []

  function resolve(value) {
    }
  function reject(reason) {
    }

  // 同步调用执行函数
  try {
   
    executor(resolve, reject)
  } catch (error) {
   
    reject(error)