ES6异步编程Promise对象全解析

发布时间：2026-09-26 01:14:35 阅读量： 23 来源： 互联网转载

Promise对象是ES6引入的异步编程解决方案，它有3种状态pending（进行中）、fulfilled（已成功）和 rejected（已失败）它的执行顺序是这样的pending=>fulfilled|rejected ,也可以理解为它返回成功和失败2种状态。下面用一个简单的例子来实现一个异步操作。

Let a= new Promise(function(resolve,reject){   let b=1;  setTimeout(()=>{    if (b===1){      resolve("我成功了")    }else{      resolve("是失败了")    }  },100)})a.then(res=>{ //.then方法返回成功时的示例  console.log(res) }).catch(err=>{ //.catch方法返回失败的示例  console.log(err)})

上面的代码看到没，针对异步操作，我们可以像使用变量一样，在我们想要的位置直接使用异步返回的值。如果上述代码不使用es6的Promise那使用回调函数

let a= (c)=>{  let b=1  setTimeout(()=>{    if (b===1){      c.success("成功")    }else{      c.err("失败")    }  },100)}a({  success:(res)=>{    console.log(res,1)  },  err:(err)=>{    console.log(err,1)  }})

和明显Promise还是更简洁的，也更直关和易读

Promise的语法

new Promise(function(resolve,reject){})

其中resolve是成功后需要返回的数据，reject失败后需要返回的数据。需要new就证明这是一个构造函数，通过console.dir(a)我们可以看到它的所有方法如下图

有1个构造函数Constructoro里面就有resolve,reject。另外有3个方法.then(成功).catch(失败).finally(成功失败都执行)，上上面已经讲过了就不讲了，下面是其他方法的说明

constructoro里的all函数既Promise.all

Promise.all是把多个Promise对象合并成一个数组并返回，示例代码

let a=Promise.all([  new Promise((resolve,reject)=>{    setTimeout(()=>{        resolve("数组1")    },100)  }),  new Promise((resolve,reject)=>{    setTimeout(()=>{      resolve("数组2")    },100)  }),  new Promise((resolve,reject)=>{    setTimeout(()=>{      resolve("数组3")    },100)  }),    ])a.then(res=>{  console.log(res)})

打印后返回['数组1', '数组2', '数组3']。Promise.all里只要有一个实例不管是主动执行reject还是出错，那么都将抛出错误。.then获取不到任何数据！

constructoro里的race函数既Promise.race

race是按照异步的先后顺序的返回数据的，即使该实例执行的是reject。打个比方，我们有5个人进行50米跑步，那么谁第一名就返回它的数据，我们看示例

let a=Promise.race([  new Promise((resolve,reject)=>{    setTimeout(()=>{        resolve("数组1")    },300)  }),  new Promise((resolve,reject)=>{    setTimeout(()=>{      resolve("数组2")    },200)  }),  new Promise((resolve,reject)=>{    setTimeout(()=>{      resolve("数组3")    },100)  })    ])a.then(res=>{  console.log(res)}).catch(err=>{  console.log(err)})

控制台显示的是数据3，因为它的时间是最短的。

constructoro里的any函数既Promise.any

这个函数的机制是这样的，只要有一个实例成功了，那么就返回数据，除非是全部失败，那么将返回一个失败的信息。它返回的对象也是按照先手顺序执行的，大家可以把上面Promise.race的示例代码改成Promise.any，然后把实例都执行reject，最后再打印会发现.catch返回AggregateError: All promises were rejected,如果resolve那么数组3将被返回。

constructoro里的allSettled函数既Promise.allSettled

我们首先上一个实例

Promise.allSettled([  Promise.resolve("ok"),  Promise.reject("err")]).then(res=>{  console.log(res)})

很明显，allSettled不管是resolve还是reject都通过.then返回一个object数据,通过数据里的status属性来确定返回成功还是失败。那么在Promise.all里，我们很难确定所有的实例请求是否结束，那么用allSettled就很容易判断了。

最后的总结

虽然异步编程可以使用回调函数，但很显然使用Promise让逻辑更清晰，功能也更强大。上述文章只是介绍了Promise基本用法，如果完全掌握一般来说也就够用了。当然Promise还有链式调用，事件循环，宏任务，微任务等，Promise还有自身的语法糖Async和Await等等其他相关知识。为什么别人说js入门简单，精通难。这简单的一个小功能就有很多的知识点，真的要完全掌握也是需要点时间的

ES6新特性合集 ES6新特性 Let Const Var的区别 ES6新特性解构赋值 ES6异步编程Promise对象全解析 ES6异步编程从Generator到Async/Await ES6新特性模块化Modules ES6新特性模板字符串Template String ES6新特性 Map的使用方法 ES6新特性之箭头函数 ES6新特性 map() filter() find()使用方法总结

上一篇: 大连中小企业网站如何写出好的原创内容

ES6异步编程Promise对象全解析

热门文章