美文网首页
Promise相关

Promise相关

作者: 糖糖不加糖_ | 来源:发表于2023-02-19 14:59 被阅读0次

https://segmentfault.com/a/1190000039275224
默认返回一个new Promise,其他的,在这个返回里面去做

Promise.all

// arr 传过来的接口请求
const Promise_all = (arr) => {
  if (!Array.isArray(arr)) {
    throw new Error('参数错误')
  }
  // 重点需要返回一个promise
  return new Promise((resolve, reject) => {
    // 一共完成了多少个
    let num = 0;
    // 返回的结果数组
    const result = [];
    for(let i = 0; i < arr.length; i++) {
      // 单条去调用promise,成功后的结果回显到result数组
      // then有两个函数参数,一个是成功,一个是失败
      Promise.resolve(arr[i]).then(res => {
        num++;
        result[i] = res;
        // 如果result数组的长度与arr相同了,则说明处理完了
        if (num === arr.length) {
          return resolve(result);
        }
      }, reason => {
        // 失败了直接终止
        return reject(reason);
      })
    }
  })
}

Promise.race

// promise_race
const promise_race = (arr) => {
  if (!Array.isArray(arr)) {
    throw new Error('失败参数')
  }
  return new Promise((resolve, reject) => {
    for(let i = 0; i < arr.length; i++) {
      Promise.resolve(arr[i]).then(res => {
        resolve(res)
      }, reason => {
        reject(reason)
      })
    }
  })
}

Promise


function MyPromise (fn) {
  // 初始状态为 pending
  this.status = 'pending';
  // 成功的值
  this.value = undefined;
  // 失败的值
  this.reason = undefined;
  // then 的回调函数集合,后面会用到
  this.fulfilledCallback = [];
  this.rejectedCallback = [];

  const resolve = (value) => {
    if (this.status === 'pending') {
      this.status = 'resolved';
      this.value = value;
       // 状态变更后执行 then 的回调函数
      this.fulfilledCallback.forEach(fn => fn(value))
    }
  }

  const reject = (reason) => {
    if (this.status = 'pending') {
      this.status = 'rejected';
      this.reason = reason;
      this.rejectedCallback.forEach(fn => fn(reason))
    }
  }

  try{
    fn(resolve, reject)
  } catch(error) {
    reject(error)
  }
}
MyPromise.prototype.then = function(onResolve, onReject) {

  if (this.status === 'resolved') {
    onResolve(this.value);
  }

  if (this.status === 'rejected') {
    onReject(this.reason);
  }

  if (this.status === 'pending') {
    this.fulfilledCallback.push(() => onResolve(this.value))
    this.rejectedCallback.push(() => onReject(this.reason))
  }
}
限制最大请求数,最快请求完毕

假如等待请求接口1000个,限制每次只能发出100个。即同一时刻最多有100个正在发送的请求。每当100个之中有一个请求完成时,则从待请求的接口(即剩余的900个待请求接口)中再取出一个发出。保证当前并发度仍旧为100。直至全部接口请求完成。

  let count = 0;
  let res = []
  // 判断是否调度函数
  const panDuan = (urls, max) => {
    if (urls.length > 0 && count < max) {
      resFn(urls)
    }
  }

  // 做接口数据请求
  const resFn = async (urls, max) => {
    count++;
    const prom = await new Promise((resolve, reject) => {
      Promise.reject(urls.shift()).then(value => {
        res.push(value);
        resolve(value)
      }, reason => {
        res.push(reason);
        reject(reason)
      })
    }) 
    prom.then(() => {
      count--;
      panDuan(urls, max)
    })
  }

  // 循环处理
  const fn1 = (urls, max) => {
    for(let i = 0; i < max; i++) {
      resFn(urls)
    }
    return res
  }

相关文章

  • Promise相关

    在 javascript 中, 所有代码都是单线程执行的。 由于这个缺陷,导致 javascript 的所有网络操...

  • promise相关

    promise promise.race promise.finally promise.catch

  • Promise相关

    https://segmentfault.com/a/1190000039275224[https://segme...

  • promise相关

    异步编程 *fs文件操作*数据库操作*ajax*定时器在promise之前的解决方式: 旧的解决方法:必须在启动异...

  • Promise相关题目

    实现一个person对象,有eat和dinner两种方法请用实例【依次类推】new Person('Tom').s...

  • Promise相关知识

    一、Promise基础 1.为什么需要Promise? js是一门单线程语言,所以早期我们在解决异步的场景时,通常...

  • Promise相关概念

    Promise 检测图片 检测图片是否加载成功,成功就正常显示,失败就展示默认图片 休眠的实现方法 基本用法 有一...

  • 深入了解下Promise

    Promise 意义 Promise 的诞生与 Javascript 中异步编程息息相关,js 中异步编程主要指 ...

  • 「超全」手写Promise的相关方法

    原文发布在:手写Promise的相关方法。 摘要 Promise 作为 JS 社区的异步解决方案,为开发者提供了....

  • UIWebView的touch的事件

    滚动的事件绑定touch相关事件的时候使用Promise异步方法回调丢失 由于ios没有自带的Promise,在P...

网友评论

      本文标题:Promise相关

      本文链接:https://www.haomeiwen.com/subject/tbpvbltx.html