📖ES6的promise用法
👨🚀 伍言Yan
⏳ 2022年 6月 15日
🔔 1K+
基础用法
let p = new Promise(function(resolve, reject){
//做一些异步操作,例如AJAX请求,定时器
setTimeout(function(){
console.log('执行完成Promise');
resolve('要返回的数据可以任何数据例如接口返回数据');
}, 2000);
});
//过两秒后打印console
调用 promise 方法
//Promise 构造函数有两个参数,且这两个参数都是函数形式
//resolve 译为:决定,即成功返回值
//reject 译为:拒绝,即错误返回值
let p = new Promise(function(resolve, reject){
var num = Math.ceil(Math.random()*10); //生成1-10的随机数
console.log(num)
if(num >= 5){
resolve()
}else{
reject()
}
});
//.then()接收两个回调函数一个是resolve(),另外一个是reject()
p.then(()=>{
console.log('大于5')
},()=>{
console.log('小于5')
})
resolve与reject携带参数返回
//Promise 中resolve与reject也可携带参数返回
let p = new Promise(function(resolve, reject){
var num = Math.ceil(Math.random()*10); //生成1-10的随机数
if(num >= 5){
resolve(num)
}else{
reject(num)
}
});
p.then(value => {
console.log('大于5值为:'+value)
},reason => {
console.log('小于5值为:'+reason)
})
.then方法解决回调地狱
let p = new Promise(function(resolve, reject){
setTimeout(function(){
var num = Math.ceil(Math.random()*10);
resolve(num)//假如num为5
},)
});
//在这里你会发现每次 then 调用都会以之前的 then 调用的返回值为参数
p.then(value => {//打印5,并返回5+5
console.log(value);
return value + value;
})
.then(value => {//打印出10,并返回10+10
console.log(value);
return value + value;
}).then(value => {//打印出20
console.log(value);
})
🧐发表评论