Promise用于处理一些需要花费长时间的任务,进行异步处理,防止任务阻塞。一般是说解决了回调地狱的问题。
那什么是回调地狱?
用吃来做比喻:
我想吃火锅
function getTea(fn) { setTimeout(() => { fn('火锅') }, 1000) } getTea(function (data) { console.log(data); })
讯享网
1s后输出:火锅。
(回调函数获取异步数据,所以这里用的是fn,而不是直接return结果。)
为了解辣我还想喝奶茶
讯享网function getHotPot(fn) { setTimeout(() => { fn('火锅') }, 1000) } function getTea(fn) { setTimeout(() => { fn('奶茶') }, 500) } getHotPot(function (data) { console.log(data); }) getTea(function (data) { console.log(data); })
先输出“奶茶”,再输出“火锅”。
function getHotPot(fn) { setTimeout(() => { fn('火锅') }, 1000) } function getTea(fn) { setTimeout(() => { fn('奶茶') }, 500) } getHotPot(function (data) { console.log(data); getTea(function (data) { console.log(data); }) })
这样就是先输出火锅,再输出奶茶了。
讯享网getHotPot(function (data) { //吃火锅 console.log(data); getTea(function (data) { //吃奶茶 console.log(data); getNailArt(function (data) { //美甲 console.log(data); getMassage(function (data) { //按摩 console.log(data); getMovie(function (data) { //看电影 console.log(data); }) }) }) }) })
为了控制顺序获得结果,并且这个结果是异步操作,那就不能直接return,用回调函数获取,还需要嵌套,嵌套多了就形成了回调地狱,代码不易维护。
Promise的用法
Promise 是异步编程的一种解决方案,其实就是一个构造函数,自己身上有all、resolve、reject这几个方法,原型上有.then、.catch等方法。
promise有三种状态: pending(等待态),fulfiled(成功态),rejected(失败态)。
function getHotPot() { return new Promise(function (resolve) { setTimeout(() => { resolve('火锅') }, 1000) }) } function getTea() { return new Promise(function (resolve) { setTimeout(() => { resolve('奶茶') }, 800) }) }
讯享网// 先吃火锅,再喝奶茶 getHotPot().then(function (data) { console.log(data); return getTea(); }).then(function (data) { console.log(data); return getNailArt(); }).then(function (data) { console.log(data); return getMassage(); }).then(function (data) { console.log(data); return getMovie(); }).then(function (data) { console.log(data);
这时如果我们使用Promise去实现这个效果,这样一级一级下去实现了链式调用,虽然代码量增加了,但比起前面的层层嵌套,显然这种方式使得代码更易读更易维护。
async function getAll(){ // 直接获取resolve传递出来的异步数据 let hotpot = await getHotPot() console.log(hotpot); let tea = await getHotPot() console.log(tea); }
依然是先输出火锅,再输出奶茶。
再看看reject和.catch的用法
还是吃火锅和喝奶茶的先后问题,如果先吃到了火锅,再喝的奶茶,就是一个满意的结果,否则就是不满意的结果,但是最后无论是先吃到了火锅还是奶茶,也无关紧要,都吃到了想吃的:
讯享网const isSatisfied = true; const promise = new Promise((resolve, reject) => { if (isSatisfied) { resolve('先吃到了火锅') } else { reject('奶茶比较快,先喝到了奶茶') } }) promise .then(name => { console.log(`满意的结果:${name}`); }) .catch(name => { console.log(`不是满意的结果:${name}`); }) .finally(() => { console.log(`最后!其实每个结果我都可以接受~`); })
输出:
满意的结果:先吃到了火锅
最后!其实每个结果我都可以接受~
如果把 isSatisfied 改为 false ,输出的结果就是:
不是满意的结果:奶茶比较快,先喝到了奶茶
最后!其实每个结果我都可以接受~
promise在自己的框架中,封装了一系列的内置的方法。
捕获错误的方法 catch()
解析全部方法 all() — 谁跑的慢,以谁为准执行回调。all接收一个数组参数,里面的值最终都算返回Promise对象
竞赛 race() — 谁跑的快,以谁为准执行回调
生成一个成功的promise resolve()
生成一个失败的promise reject()
总结
promise解决以下问题:
回调地狱,代码难以维护, 第一个的函数的输出是第二个函数的输入;
promise可以支持多个并发的请求,获取并发请求中的数据;
promise可以解决异步的问题,但是不能说promise是异步的。
————————————————
原文链接:https://blog.csdn.net/Cici__zc/article/details/

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容,请联系我们,一经查实,本站将立刻删除。
如需转载请保留出处:https://51itzy.com/kjqy/54989.html