1. Promise
promise,中文翻译为“承诺”。
一个 Promise 就是一个代表了异步操作最终完成或者失败的对象 ————MDN
简单来说,Promise是一个代理对象,该对象代理一个未知的值。当异步操作成功的时候,代理值会变成成功特定的状态;异步操作失败,代理值会变成失败特定的状态。我们可以通过为 “成功状态” 或 “失败状态” 指定回调函数来对异步操作的结果进行操作。
Promise 对象的特点:
- 对象状态。Promise 有3个状态:
pending待完成,fulfilled完成,rejected拒绝。 Promise 对象的状态可以通过使用resolve()或reject()来改变,一般是通过判断异步操作的结果取执行相应的状态函数。 - Promise 的状态只会改变一次,一旦发生改变。后面的操作就不能再改变
Promise对象的状态
Promise的缺点:
- 无法取消,只要新建,就一定会执行
- 回调函数的错误不会抛出,必须手动指定回调函数抛出错误。(
then方法的第二个函数) pending状态时,无法得知异步操作的进度。
2. Promise 构造对象
ES6 中,Promise 是一个构造对象,用来构造一个 Promise 对象。
let promise = new Promise(function(resolve,reject){
// 一些构造promise对象时,立即执行的代码(发起异步操作等)
if(/* 异步操作成功 */){
resolve(value) // pedding => fulfilled
}else{
reject(error) // pedding => rejected
}
})
Promise 构造函数接受一个函数作为参数,作为参数的函数又必须接受两个参数(
reslove,reject)。reslove会将 Promise 对象的状态从pending(待处理)变成fulfilled(完成)reject会将 Promise 对象的状态从pending(待处理)变成rejectedreslove,reject是两个浏览器自己部署的函数,作用只有一个:转变 Promise 对象的状态,同时将参数传递下去作为then方法回调函数的参数
resolve在异步成功之后改变Promise的状态:
console.log(1)
function fn(){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
console.log('10秒钟之后打出这行字,之后promise对象的状态会被下面的代码改为 fulfilled')
resolve('xx')
},10000)
})
}
console.log(2)
let promise = fn()
console.log(promise)
promise.then((promiseValue)=>{
console.log(promiseValue)
})
console.log(promise)
生成Promise实例之后,可以使用then方法为Promise实例对象的不同状态指定回调函数
promise.then(()=>{
console.log('Promise对象的状态是 fulfilled') // 若 promise 的状态是 fulfilled,则会打出这行字
},()=>{
console.log('Promise对象的状态是 rejected') // 若 promise 的状态是 rejected,则会打出这行字
})
3. Promise的then方法
Promise 对象提供一个 then方法,用来为 Promise添加状态改变后的回调函数,then方法同样返回一个Promise对象,这就意味着,Promise可以使用链式操作。
then方法的第一个参数指定fulfilled的回调函数,第二个参数指定rejected的回调函数。
let promise = new Promise(function(resolve,reject){
if(/* 异步成功 */){
resolve()
}else{
reject()
}
})
promise.then(()=>{
return '异步操作成功之后,状态变为fulfilled之后执行的函数'
},()=>{
return '异步操作之后,状态变为rejected之后执行的函数'
}).then().then()
只要每一次使用then方法都return,就能一直使用then链式操作下去。
常用来对一个异步操作执行多个回调函数。
4. Promise的catch方法
上面说过 Promise对象如果不指定回调函数的话,错误会无法抛出,而catch方法就用来指定抛出错误的回调函数。
catch方法接受一个函数,函数的参数就是抛出的错误。
promise().then(()=>{}).catch((error)=>{
console.log(error)
})
5. Promise的finally方法
Promise的finally方法指定Promise对象的最后异步执行的函数,无论Promise对象的状态是什么,该回调函数都会执行(与状态无关,不依赖Promise结果)。一般会在链式操作的最后出现。
promise().then().finally(()=>{
console.log('无论Promise对象怎么样,最后都会打出这句话')
})
6. Promise.all()
Promise.add用于将多个 Promise实例包装成一个新的Promise实例
let newPromise = Promise.all([promise1,promise2,promise3])
上面代码将数组中的 3 个Promise实例包装成一个实例 newPromise。若数组中有某一项不是Promise实例,会调用Promise.resolve方法转化成实例。
newPromise 的状态有两种结果:
- 数组中所有实例的状态都是
fulfilled,newPromise 的状态是fulfilled,newPromise 的resolve方法参数是数组中实例的返回值组成的数组。 - 数组中有一个实例的状态是
rejected, newPromise 的状态是rejected,newPromise 的reject方法参数是第一个rejected状态的实例的返回值。
未完待续。。。