Promise回顾
Promise
Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理且更强大。它最早由社区提出并实现,ES6将其写进了语言标准,统一了用法,并原生提供了Promise对象。
特点
- 对象的状态不受外界影响 (3种状态)
- Pending状态(进行中)
- Fulfilled状态(已成功)
- Rejected状态(已失败)
- 一旦状态改变就不会再变 (两种状态改变:成功或失败)
- Pending -> Fulfilled
- Pending -> Rejected
用法
创建Promise实例
1 2 3 4 5 6 7 8 9 | var promise = new Promise( function (resolve, reject){ // ... some code if ( /* 异步操作成功 */ ) { resolve(value); } else { reject(error); } }) |
Promise构造函数接受一个函数作为参数,该函数的两个参数分别是resolve
和reject
。它们是两个函数,由JavaScript引擎提供,不用自己部署。
resolve作用是将Promise对象状态由“未完成”变为“成功”,也就是Pending -> Fulfilled
,在异步操作成功时调用,并将异步操作的结果作为参数传递出去;而reject函数则是将Promise对象状态由“未完成”变为“失败”,也就是Pending -> Rejected
,在异步操作失败时调用,并将异步操作的结果作为参数传递出去。
then
Promise实例生成后,可用then
方法分别指定两种状态回调参数。then 方法可以接受两个回调函数作为参数:
- Promise对象状态改为Resolved时调用 (必选)
- Promise对象状态改为Rejected时调用 (可选)
1 2 3 4 5 6 | function sleep(ms) { return new Promise( function (resolve, reject) { setTimeout(resolve, ms); }) } sleep(500).then( ()=> console.log( "finished" )); |
这段代码定义了一个函数sleep,调用后,等待了指定参数(500)毫秒后执行then中的函数。值得注意的是,Promise新建后就会立即执行。
1 2 3 4 5 6 7 8 9 10 | let promise = new Promise( function (resolve, reject){ console.log( "AAA" ); resolve() }); promise.then(() => console.log( "BBB" )); console.log( "CCC" ) // AAA // CCC // BBB |
执行后,我们发现输出顺序总是
AAA -> CCC -> BBB
。表明,在Promise新建后会立即执行,所以首先输出 AAA
。然后,then方法指定的回调函数将在当前脚本所有同步任务执行完后才会执行,所以BBB 最后输出
。1 2 3 4 5 6 7 8 9 10 11 12 | let promise = new Promise( function (resolve, reject){ console.log( "1" ); resolve(); }); setTimeout(()=>console.log( "2" ), 0); promise.then(() => console.log( "3" )); console.log( "4" ); // 1 // 4 // 3 // 2 |
可以看到,结果输出顺序总是:
1 -> 4 -> 3 -> 2
。1与4的顺序不必再说,而2与3先输出Promise的then,而后输出定时器任务。原因则是Promise属于JavaScript引擎内部任务,而setTimeout则是浏览器API,而引擎内部任务优先级高于浏览器API任务,所以有此结果。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 周边上新:园子的第一款马克杯温暖上架
2016-03-31 webpack window下配置的hello world
2016-03-31 Vue.js 添加组件
2016-03-31 Vue.js 综合
2016-03-31 Vue.js hello world
2015-03-31 utf-8编码的中文看成2个字符,其他数字字符看成一个字符
2013-03-31 连接数库失败could not find driver Fatal error: Call to a member function prepare() on a non-object in D:\AppServ\www\xsphp_code\brophp\bases\dpdo.class.php