上海建设局官方网站,长春网站建设58同城,网页设计与网站制作,wordpress如何绑定域名一#xff0c;为什么要使用promise,ta能解决那些问题#xff1f;
Promise 是异步编程的一种解决方案#xff1a; 从语法上讲#xff0c;Promise是一个对象#xff0c;从它可以获取异步操作的消息#xff1b;从本意上讲#xff0c;它是承诺#xff0c;承诺它过一段时间…一为什么要使用promise,ta能解决那些问题
Promise 是异步编程的一种解决方案 从语法上讲Promise是一个对象从它可以获取异步操作的消息从本意上讲它是承诺承诺它过一段时间会resolve给你一个结果。ta有三种状态pending(等待态)fulfiled(成功态)rejected(失败态),一旦状态有pending状态转为后两者之一就不可逆转也就是说成功和失败之间是不可转换的。new一个promise之后ta就是会立即执行。
【互联网行业信息差】全网自媒体公众号小红薯打工太累聊聊互联网趣事看代码
let P new Promise((resolve,reject) {setTimeout(() {resolve(1)}, 3000)
});
P.then(data {console.log(data)
}, err {})说明 这里new了一个Promise,new Promise(execut);这里的execut会立即执行。p.then也会立即执行这个then究竟做了什么呢后面会说
我们再来说一下在没有Promise之前我们写代码经常遇到的一个问题回调地狱
function fn(a,cb){setTimeout(() {a 10 * Math.random()cb(a) //这里就是cb需要等待},300)
}function fn1(c){if(c5){console.log(c)}else{console.log(值偏小)}
}fn(0,fn1)有时候我们为了等待某个值需要嵌套很多层这样为了解决这个问题Promise就应运而生了Promise是用来解决以下几个问题的
解决多层嵌套问题也就是我们常说的回调地狱(then)解决多个异步 请求问题all,race
我们来看看用promise怎么写上面的代码
let p1 new Promise((resolve, reject){setTimeout(() {a 10 * Math.random()resolve(a) //这里就是cb需要等待},300)
})p1.then(data {fn1(data)
})特别是多层嵌套的时候Promise的好处将更加明显 【互联网行业信息差】全网自媒体公众号小红薯打工太累聊聊互联网趣事二下面跟着我一起学习一下Promise的常见用法吧
Promise是一个构造函数自己身上有reject,resolve,all,race这几个方法原型上有then、catch等方法。
Promise的构造函数接收一个参数函数(执行器这个执行器是立即执行的)并且这个函数需要传入两个参数
resolve 异步操作执行成功后的回调函数reject异步操作执行失败后的回调函数 你需要注意的是 在Promise的执行器里面必须要有resolve,或者reject这两个回调函数执行。通过resolve或则reject来改变Promise的状态为成功或者失败并且执行then里面的成功函数或者失败的函数。
【互联网行业信息差】全网自媒体公众号小红薯打工太累聊聊互联网趣事then 链式操作的用法
从表面上看Promise只是能够简化层层回调的写法而实质上Promise的精髓是“状态”用传递状态的方式来使得回调函数队列能够及时调用所以使用Promise的正确场景是这样的
function fn1(c){if(c5){console.log(c)}else{console.log(值偏小)}
}
let p1 new Promise((resolve, reject){setTimeout(() {a 10 * Math.random()resolve(a) //这里就是cb需要等待},300)
})p1.then(data {fn1(data)return data
})
.then((data) {console.log(data) //1.333
})
.then((data) {console.log(data) //undefined
})这里顺带讲一下 then的传递如果then里面的回调返回的是一个Promise那么就将这个Promise的resolve的值传递给下一个then的data值如果返回的是一个普通值那么就将这个普通值传递给下一个then的data值例如上面的结果。
reject的用法
将Promise的状态置为rejected这样我们在then中就能捕捉到然后执行“失败”情况的回调。这里就不再详细叙述。
catch的用法
它是做什么用的呢其实它和then的第二个参数一样用来指定reject的回调。这里就不再详细叙述。
all的用法
let Promise1 new Promise(function(resolve, reject){setTimeout(() {resolve(1)},300)})
let Promise2 new Promise(function(resolve, reject){setTimeout(() {resolve(2)},200)
})
let Promise3 new Promise(function(resolve, reject){setTimeout(() {resolve(3)},100)
})let p Promise.all([Promise1, Promise2, Promise3])p.then((data) {console.log(data) //[1,2,3] 这里的顺序和all的顺一样和异步回调执行得到结果的顺序无关// 三个都成功则成功
}, function(){// 只要有一个失败则失败
})有了all你就可以并行执行多个异步操作并且在一个回调中处理所有的返回数据是不是很方便
【互联网行业信息差】全网自媒体公众号小红薯打工太累聊聊互联网趣事race的用法
let Promise1 new Promise(function(resolve, reject){setTimeout(() {resolve(1)},300)})
let Promise2 new Promise(function(resolve, reject){setTimeout(() {resolve(2)},200)
})
let Promise3 new Promise(function(resolve, reject){setTimeout(() {resolve(3)},100)
})let p Promise.race([Promise1, Promise2, Promise3])p.then((data) {console.log(data)// 三个都成功则成功
}, function(){// 只要有失败则失败
})以最先得到的结果为准即使如果最先拿回来的是reject的结果那么race就是reject的结果。 好了promise的常见用法就这些下一篇我们来聊聊promise的源码