带你读《现代Javascript高级教程》二十七、实现符合Promise/A+规范的Promise(6)

简介: 带你读《现代Javascript高级教程》二十七、实现符合Promise/A+规范的Promise(6)

带你读《现代Javascript高级教程》二十七、实现符合Promise/A+规范的Promise(5)https://developer.aliyun.com/article/1349503?groupCode=tech_library


2实现Promise.race Promise.race方法接收一个可迭代对象(如数组或类数组对象),并返回一个新的Promise,该Promise将与最先解决或拒绝的输入Promise具有相同的状态。

Promise.race = function (promises) {
  return new Promise((resolve, reject) => {
    for (let i = 0; i < promises.length; i++) {
      promises[i]
        .then((value) => {
          resolve(value);
        })
        .catch((reason) => {
          reject(reason);
        });
    }
  });};

使用示例:

 

const promise1 = new Promise((resolve) => setTimeout(() => resolve(1), 1000));const promise2 = new Promise((resolve) => setTimeout(() => resolve(2), 2000));const promise3 = new Promise((resolve) => setTimeout(() => resolve(3), 1500));
Promise.race([promise1, promise2, promise3])
  .then((value) => {
    console.log(value); // 输出: 1
  })
  .catch((reason) => {
    console.error(reason);
  });
  1. 参考资料

Promise/A+ 规范官方文档:https://promisesaplus.com/

 

 

相关文章
|
4天前
|
JSON 前端开发 JavaScript
【JavaScript技术专栏】JavaScript异步编程:Promise、async/await解析
【4月更文挑战第30天】JavaScript中的异步编程通过Promise和async/await来解决回调地狱问题。Promise代表可能完成或拒绝的异步操作,有pending、fulfilled和rejected三种状态。它支持链式调用和Promise.all()、Promise.race()等方法。async/await是ES8引入的语法糖,允许异步代码以同步风格编写,提高可读性和可维护性。两者结合使用能更高效地处理非阻塞操作。
|
2天前
|
前端开发 JavaScript
JavaScript新科技:PostCSS的安装和使用,2024年最新2024网易Web前端高级面试题总结
JavaScript新科技:PostCSS的安装和使用,2024年最新2024网易Web前端高级面试题总结
|
2天前
|
JavaScript 前端开发
web前端JS高阶面试题(1),高级开发工程师面试
web前端JS高阶面试题(1),高级开发工程师面试
|
2天前
|
前端开发 JavaScript
前端 js 经典:Promise
前端 js 经典:Promise
9 1
|
4天前
|
前端开发 JavaScript
在JavaScript中,回调函数、Promise和async/await这三种异步处理机制的优缺点
JavaScript的异步处理包括回调函数、Promise和async/await。回调函数简单易懂,但可能导致回调地狱和错误处理困难。Promise通过链式调用改善了这一情况,但仍有回调函数需求和学习成本。async/await提供同步风格代码,增强可读性和错误处理,但需ES8支持,不适用于并发执行。根据项目需求选择合适机制。
|
4天前
|
JavaScript 前端开发
JavaScript高级主题:什么是 ES6 的解构赋值?
【4月更文挑战第13天】ES6的解构赋值语法简化了从数组和对象中提取值的过程,提高代码可读性。例如,可以从数组`[1, 2, 3]`中分别赋值给`a`, `b`, `c`,或者从对象`{x: 1, y: 2, z: 3}`中提取属性值给同名变量。
18 6
|
5天前
|
存储 JavaScript 前端开发
JavaScript高级主题:JavaScript 中的 Map 和 Set 是什么?它们有什么区别?
JavaScript的ES6引入了Map和Set数据结构。Map用于存储键值对,适合通过键进行查找,而Set则存储唯一值,无键且不支持键查找。两者在性能上表现出色,尤其在频繁的写入删除操作中。选择使用哪个取决于具体应用场景:键值对需求选Map,独特值集合则选Set。
20 2
|
4天前
|
JavaScript 前端开发 Java
JavaScript高级笔记-coderwhy版本(六)
JavaScript高级笔记-coderwhy版本
75 0
|
2天前
|
缓存 JavaScript 前端开发
JavaScript:get和post的区别,2024年最新3-6岁儿童学习与发展指南心得体会
JavaScript:get和post的区别,2024年最新3-6岁儿童学习与发展指南心得体会