promise
- 主要解决异步深层嵌套的问题
- promise 提供了简洁的API 使得异步操作更加容易
primise基本使用
//1.创建promise对象
//接受一个函数对象,参数为两个对象:resolve,reject
//resolve表示成功操作
//reject表示失败操作
let p =new Promise((resolve, reject)=>{
//2. 这里用于实现异步任务 setTimeout
setTimeout(()=>{
let flag=false
if(flag){
//3. 正常情况
resolve('成功')
}else{
//4.出错情况
reject('失败')
}
},100)
})
p.then(data=>{
console.log(data)
},err=>{
console.log(err)
})
Promise 基本API
实例方法
then() 得到异步任务正确的结果
catch() 获取异常信息
finally() 成功与否都会执行(不是正式标准)
//1.创建promise对象
//接受一个函数对象,参数为两个对象:resolve,reject
//resolve表示成功操作
//reject表示失败操作
let p =new Promise((resolve, reject)=>{
//2. 这里用于实现异步任务 setTimeout
setTimeout(()=>{
let flag=false
if(flag){
//3. 正常情况
resolve('成功')
}else{
//4.出错情况
reject('失败')
}
},100)
})
//两种写法都行
p.then(data=>{
console.log(data)
}).catch(err=>{
console.log(err)
}).finally(()=>{
console.log('finished')
});
//p.then(data=>{
// console.log(data)
//},err=>{
// console.log(err)
//}).finally(function(){
// console.log('finished')
//});
静态方法
all() 用于将多个Promise实例,包装成一个新的Promise实例。
function createTimer(time){
//1.创建promise对象
//接受一个函数对象,参数为两个对象:resolve,reject
//resolve表示成功操作
//reject表示失败操作
return new Promise((resolve, reject)=>{
//2. 这里用于实现异步任务 setTimeout
setTimeout(()=>{
let flag=true
if(flag){
//3. 正常情况
resolve('成功')
}else{
//4.出错情况
reject('失败')
}
},time)
})
}
let p1=createTimer(100)
let p2=createTimer(200)
let p3=createTimer(300)
// all 中的参数 [p1,p2,p3] 和 返回的结果一 一对应['成功','成功','成功']
Promise.all([p1,p2,p3]).then(data=>{
console.log(data) //['成功','成功','成功']
})
race() 用于将多个Promise实例,并把第一个改变状态的promise的返回值,传给p的回调函数
function createTimer(time){
//1.创建promise对象
//接受一个函数对象,参数为两个对象:resolve,reject
//resolve表示成功操作
//reject表示失败操作
return new Promise((resolve, reject)=>{
//2. 这里用于实现异步任务 setTimeout
setTimeout(()=>{
let flag=true
if(flag){
//3. 正常情况
resolve('成功')
}else{
//4.出错情况
reject('失败')
}
},time)
})
}
let p1=createTimer(100)
let p2=createTimer(200)
let p3=createTimer(300)
// race 中的参数 [p1,p2,p3] 和 返回的结果为率先改变状态的promise对象
//由于p1最先执行,所以回调函数返回的结果为p1的值
Promise.race([p1,p2,p3]).then(data=>{
console.log(data) //p1的成功
})
resolve() 将现有对象转为Promise对象,其实例状态为
resolve
let p=Promise.resolve('成功')
// 等价于
let p =new Promise(resolve => resolve('成功'))
p.then(data=>{
console.log(data)
}, null);
//成功
Promise.resolve方法的参数分成四种情况。
(1)参数是一个Promise实例
不做任何修改、原封不动地返回这个实例
(2)参数是一个thenable对象(指的是具有then方法的对象)
thenable对象指的是具有then方法的对象,比如下面这个对象。
let thenable = {
then: function(resolve, reject) {
resolve(42);
}
};
(3)参数不是具有then方法的对象,或根本就不是对象
则Promise.resolve
方法返回一个新的Promise对象,状态为Resolved
。
let p = Promise.resolve('Hello');
p.then(data=>{
console.log(data)//Hello
});
Promise.resolve
方法的参数,会同时传给回调函数。
(4)不带有任何参数
如果希望得到一个Promise对象,直接调用Promise.resolve()
直接返回一个Resolved
状态的Promise对象。
setTimeout(()=>{
console.log('three');
}, 0);
Promise.resolve().then(()=>{
console.log('two');
});
console.log('one');
//one
//two
//three
需要注意的是,立即resolve
的Promise
对象,是在本轮“事件循环”(event loop)的结束时,而不是在下一轮“事件循环”的开始时。
setTimeout(fn, 0)
在下一轮“事件循环”开始时执行,Promise.resolve()
在本轮“事件循环”结束时执行,console.log(’one‘)
则是立即执行,因此最先输出
reject() 将现有对象转为Promise对象,其实例状态为
reject
let p = Promise.reject('出错了');
// 等同于
let p = new Promise((resolve, reject) => reject('出错了'))
p.then(null, s=>{
console.log(s)
});
// 出错了
它的参数用法与Promise.resolve方法完全一致。