首页 > 其他分享 >手写Promise

手写Promise

时间:2023-09-13 10:59:35浏览次数:34  
标签:function status resolve self onFulfilled reason Promise 手写

       // excutor:可以理解为传入一个函数为执行器
       function myPromise(excutor) {
          // 1. 执行结构
          let self = this
          self.status = 'pending' // 状态
          self.value = null //成功的值
          self.reason = null //失败原因

          // 8. 添加缓存数组
          self.onFulfilledCallbacks = []
          self.onRejectedCallbacks = []

          // 成功 4.判断状态做相应处理
          function resolve(value) {
              if (self.status === 'pending') {
                  self.value = value //保存成功结果
                  self.status = 'fulfilled'
                  // 10. 状态改变,依次取出
                  self.onFulfilledCallbacks.forEach(item => item(value))
              }
          }
          // 失败
          function reject(reason) {
              if (self.status === 'pending') {
                  self.reason = reason //保存失败原因
                  self.status = 'rejected'
                  // 10. 状态改变,依次取出
                  self.onRejectedCallbacks.forEach(item => item(reason))
              }
          }
          // 3.执行一遍
          try {
              excutor(resolve, reject)
          } catch (error) {
              reject(error)
          }
      }
      //2. then 关联到原型链上
      myPromise.prototype.then = function (onFulfilled, onRejected) {
          // 5.状态改变,调用then方法
          onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : function (data) { resolve(data) }
          onRejected = typeof onRejected === 'function' ? onRejected : function (err) { throw err }
          // 9. 先添加进去
          let self = this
          if (self.status === 'pending') {
              self.onFulfilledCallbacks.push(onFulfilled)
              self.onRejectedCallbacks.push(onRejected)
          }
      }

      let demo = new myPromise((resolve, reject) => {
          console.log("打印出内容")
          //6. 尝试异步
          setTimeout(() => {
              resolve('异步成功')
          }, 500)
      })

      // 执行 7.异步失败
      demo.then(data => console.log(data)) //异步成功

标签:function,status,resolve,self,onFulfilled,reason,Promise,手写
From: https://www.cnblogs.com/chic-life/p/17698915.html

相关文章

  • 开课吧前端1期.阶段2:ES6详解-4 Promise generator-认识生成器函数 generator-yield
    10、PromisePromise--承诺异步:操作之间没啥关系,同时进行多个操作同步:同时只能做一件事优缺点异步:代码更复杂同步:代码简单 //比如我要请求4个数据,真正生产还要判断,没法看了,缩进//异步:特别麻烦ajax('/banners',function(banners)){ajax('/hotItem......
  • Python给你一个字符串,你怎么判断是不是ipv4地址?手写这段代码,并写出测试用例【杭州多测
    ipv4地址的格式:(1~255).(0 ~255).(0 ~255).(0 ~255)1.正则表达式importredefcheck_ip(one_str):compile_ip=re.compile('^(([1-9]|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])\.){3}(\d|[1-9]\d|1\d{2}|2[0-4]\d|25[0-5])$')ifcompile_ip.match(one_str......
  • 自己动手写一个C++日志库
    自己动手写一个C++日志库logger.h////CreatedbyFkkton2023/9/8.//#pragmaonce#include<string>#include<iostream>#include<fstream>#include<chrono>#include<sstream>namespacefkkt{classlogger{public:......
  • promise.all和promise.race途中出现错误运行情况
    1.promise.alla.在使用时,如果中间不出错返回reject,会在.then()后返回每一个promise的resolve()返回的内容。functionp1(){returnnewPromise((resolve,reject)=>{console.log('成功1')resolve('成功1')})}functionp2(){returnnewP......
  • 【JS】手写防抖
    防抖分为立即执行版本和非立即执行版本 <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>防抖&......
  • C++_手写数据库连接池
    C++_手写数据库连接池关键技术点MySQL数据库编程、单例模式、queue队列容器、C++11多线程编程、线程互斥、线程同步通信和unique_lock、基于CAS的原子整形、智能指针shared_ptr、lambda表达式、生产者-消费者线程模型连接池的主要功能点单例模式:因为连接池只需要一个实例......
  • 手写Openfeign实现原理——极简版
    文章目录前言Openfeign实现思路前期准备基本依赖项开始实现自定义注解自定义代理类定义创建代理对象的工厂InstantiationAwareBeanPostProcessor实现bean的注入OpenInstantiationAwareBeanPostProcessor自定义feign接口启动类小结踩坑记录@Import@Component和@Configuration区别......
  • Promise 封装 Ajax
    Ajax请求是前端使用频率最高的功能之一,虽然现在有各种各样的工具库能够实现快速简洁的调用Ajax接口,但是在一些特定项目中,我们可能就是需要使用原生Ajax来发送请求。今天我们就来尝试着使用Promise封装一下原生Ajax,改善其回调冗长的问题。封装封装的主要思路就是:如果成......
  • Lnton羚通算法算力云平台使用支持向量机来识别手写字符相关步骤
    使用支持向量机(SupportVectorMachine,SVM)来识别手写字符是一个常见的机器学习任务。下面是一个基本的步骤:数据准备:收集手写字符的训练数据集和测试数据集。每个样本应该包括一个手写字符图像和相应的标签或类别。特征提取:从手写字符图像中提取特征。常见的特征提取方法包括使用......
  • What's the difference between Async Await and Promise in JavaScript All In One
    What'sthedifferencebetweenAsyncAwaitandPromiseinJavaScriptAllInOneAsyncvsPromisedemos(......