vue-Promise的链式调用
上一篇讲了promise的使用,这里不加赘述。但有时候会发现then里面的代码即使抽离出来还是很多,有没有办法再进行抽离呢?promise也提供这样的方式,能让回调后的代码进行一块一块地处理,代码如下:
new Promise((resolve, reject) => { //执行异步请求 $.get("test.cgi", { name: "John", time: "2pm" }, function (data) { resolve(data) }); }).then(data => { alert("Data Loaded处理1: " + data); //这里处理第一部分 alert("Data Loaded处理1: " + data); return new Promise(resolve => { //调用下一个then resolve(data) }) }).then((data) => { alert("Data Loaded处理2: " + data); //处理第二部分 alert("Data Loaded处理2: " + data); alert("Data Loaded处理2: " + data); return new Promise(resolve => { resolve(data) }) }).then((data) => { alert("Data Loaded处理3: " + data); //第三部分 alert("Data Loaded处理3: " + data); })
当然了,这里只是演示了resolve,但reject的使用也是差不多,是调用下一个catch而已;
回归正题,我们发现进入到下一个then,要 return new Promise....,代码有点长,有没有简便写法呢?有,如下:
new Promise((resolve, reject) => { //执行异步请求 $.get("test.cgi", { name: "John", time: "2pm" }, function (data) { resolve(data) }); }).then(data => { alert("Data Loaded处理1: " + data); alert("Data Loaded处理1: " + data); return Promise.resolve(data) }).then((data) => { alert("Data Loaded处理2: " + data); alert("Data Loaded处理2: " + data); alert("Data Loaded处理2: " + data); return Promise.resolve(data) }).then((data) => { alert("Data Loaded处理3: " + data); alert("Data Loaded处理3: " + data); })
你以为这样就最简便了?不,还有更简便的:
new Promise((resolve, reject) => { //执行异步请求 $.get("test.cgi", { name: "John", time: "2pm" }, function (data) { resolve(data) }); }).then(data => { alert("Data Loaded处理1: " + data); alert("Data Loaded处理1: " + data); return data }).then((data) => { alert("Data Loaded处理2: " + data); alert("Data Loaded处理2: " + data); alert("Data Loaded处理2: " + data); return data }).then((data) => { alert("Data Loaded处理3: " + data); alert("Data Loaded处理3: " + data); })
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异
· 三行代码完成国际化适配,妙~啊~
2020-04-03 JavaSE-线程的状态图