promiseA+ 规范
- 一个开放标准，对于开发人员可以操作的JavaScript promise标准
- promise是一个构造方法，实例化promise 时传入一个函数作为处理器。
- 处理器函数有两个参数resolve 和reject 分别将结果变为成功态和失败态
- promise对象执行成功了要有一个结果，通过resolve传递出去，失败的话失败原因通过reject传递出去
- promise 是一个有then方法的对象或者函数
- thenalbe 是一个有then方法的对象或者函数
- value 是promise状态成功的值，也就是resolve的参数，包括各种数据类型，也包括undefined thenable或者是promise
- reason 是promise状态失败时的值，也就是reject的参数，表示拒绝的原因
- exception是一个使用throw抛出的异常值
- 三种状态
- pending
- 初始的状态，可以改变
- 一个promise在resolve和reject前都处于这个状态
- 可以通过resolve 变成fulfilled状态
- 可以通过reject 变成rejected状态
- fulfilled
- 最终态，不可变
- 一个promise被resolve后会变成这个状态
- 必须拥有一个value值
- rejected
- 最终态，不可变
- 一个promise被reject之后会变成这个状态
- 必须有一个reason
- resolve()方法
resolve(value)- value能传入的值
- 普通值
- promise对象
- thenable对象
- 实例
const promise = new Promise((resolve, reject) => { resolve([ {name: 'macbook', price: 993, intro: 'asdjfl'}, {name: 'iphone', price: 32, intro:'sldfk'} ]) }) promise.then(res => { console.log(res) }).catch(err => { console.log("error") })const promise = new Promise((resolve, reject) => { resolve(new Promise((resolve, reject) => { setTimeout(() => { resolve("hello javascript") },3000) })) }) promise.then(res => { console.log(res) }).catch(err => { console.log("error") })const promise = new Promise((resolve, reject) => { resolve({ name: 'javascript', then: function(resolve) { resolve(112) } }) }) promise.then(res => { console.log(res) //112 }).catch(err => { console.log("error") }) - value能传入的值
- then方法
promise.then(onFulfilled, onRejected)- onFulfilled 必须是参数类型，可以选择，如果不是函数，就应该被忽略
- onRejected 必须是函数类型，可以选择，如果不是函数，就应该被忽略
onFulfilled特征- 在promise变成fulfilled的时候，onFulfilled会被调用
- 在promise变成fulfilled之前，不应该被淘汰
- 只能被调用一次
onRejected特征- 在promise变成rejected之前，就应该调用onRejected，参数是reason
- 在promise变成rejected之前，不应该被调用
- 只能被调用一次
- then方法可以被调用多次
-
promise状态变成fulfilled，所有的onFulfilled回调需要按照then的顺序执行，也就是按照注册顺序执行
-
promise状态变成rejected之后，所有的onRejected回调需要按照then的顺序执行，也就是按照注册表的顺序执行
-
then必须返回要给promise
-
promise支持链式调用，then方法返回的是一个新的promise，链式中的then是等待这个promise有决议之后执行的
-
代码示例
// 返回的是undefined const newPromise = new Promise((resolve, reject) => { setTimeout(() => { resolve("why") }, 3000) }) newPromise.then(res => { console.log("第一个promise的方法",res) // why }).then(res => { console.log("第二个promise的方法", res); //undefined 这里调用的是newPromise.then，由于上面的then没有返回东西，默认返回undefnied })// 返回的是普通值 const newPromise = new Promise((resolve, reject) => { setTimeout(() => { resolve("why") }, 3000) }) newPromise.then(res => { console.log("第一个promise的方法",res) //why return "bbb" }).then(res => { console.log("第二个promise的方法", res); //bbb })//返回的是promise对象 const newPromise = new Promise((resolve, reject) => { setTimeout(() => { resolve("why") }, 3000) }) const promise = new Promise((resolve, reject) => { resolve("why") }) promise.then(res => { console.log("第一个promise的方法",res) return newPromise }).then(res => { console.log("第二个promise的方法", res); })// 返回的是thenable const newPromise = new Promise((resolve, reject) => { setTimeout(() => { resolve("why") }, 3000) }) newPromise.then(res => { console.log("第一个promise的方法",res) return { then:function (resolve){ resolve("thenable") } } }).then(res => { console.log("第二个promise的方法", res); })
-
- catch() 方法
- promise.reject()方法是返回一个带有拒绝原因的promise对象，也会返回一个新的promise
- 中断函数继续执行 1. return 2. throw new Error() 3. yield函数
- 示例
// catch返回新的promise const promise = new Promise((resolve, reject) => { reject("error aaaa") }) promise.catch(err => { console.log("then第一次回调", err) }).then(res => { console.log("then第二次回调",res) }).then(res => { console.log("then第三次回调",res) })const promise = new Promise((resolve,reject) => { resolve("bbbb") }) promise.then(res => { console.log("then 第一次回调",res) throw new Error("第二次promise的异常error") }).then(res => { console.log("then第二次回调",res) }).then(res => { console.log("then第三次回调",res) }).catch(err => { console.log("then第四次回调", err) }) console.log("后续执行的代码") - finally 方法
promise对象无论变成fulfilled还是rejected状态，最终都会被执行的代码，finally是不接受参数的，前面无论是fulfill状态，还是reject状态，都会执行const promise = new Promise((resolve, reject) => { reject("error aaaa") }) promise.catch(err => { console.log("then第一次回调", err) }).then(res => { console.log("then第二次回调",res) }).then(res => { console.log("then第三次回调",res) }).finally(()=> { console.log("finally action") }) - Executor
- Executor 是在创建Promise时候需要传入的一个回调函数，这个回调函数会被立即执行，并且传入两个参数
- 通过resolve，如果传入的不是一个promise ，可以兑现(fulfilled)promise的状态。之后去调reject的时候，无法改变promise的状态，故不会有任何相应
- 通过reject，可以拒绝(rejected)promise的状态
- resolve类方法
then,catch,finally 方法都属于promise的实例方法，都是存放在promise.prototype上的- resolve参数的形态
- 普通值或者队形
- promise
- thenable
- 实例
Promise.resolve("hello world").then(res => { console.log("then结果", res) }) //等价于 new Promise((resolve) => { resolve("hello world") }) - resolve参数的形态
- reject类方法
类似于resolve方法，只是会讲promise对象的状态设置为reject状态。不论参数是什么形态，都会直接作为reject状态的参数传递到catch的Promise.reject("hello world") new Promise((resolve, reject) => reject("hello world")) - 实例
const promise = new Promise((resolve, reject) => { // 1 resolve() //2 reject() //3 }) promise.then(value => { console.log("成功的回调") }).catch(err => { console.log("失败的回调") }) //补充 resolve() reject()只会被调用一次。- 解释
promise的三种状态，1处是pending初始状态，通过调用resolve()函数，将初始状态变成以对象状态。 2处是fulfilled状态fulfilled状态是最终态，不会改变，所以3处代码reject()不会执行
const promise = new Promise((resolve, reject) => { reject("failure") }) promise.then(res => { console.log("成功的回调",res) }) promise.catch(err => { console.log("失败的回调",err) }) promise.catch(err => { console.log("失败的回调",err) }) promise.catch(err => { console.log("失败的回调",err) })promise.then(res => { console.log("成功回调",res) }, err => { console.log("失败回调",err) }) - 解释
- all方法
- 将多个promise包裹在一起形成一个新的promise对象
- 新的promise的状态是有所有的promise共同决定的
- 当多有的promise状态变成fulfilled状态的时候，新的promise状态会变成fulfilled，并将所有的promise的返回值组成一个数组
- 当有一个promise状态变成reject的时候，新的promise状态变成reject，并会将第一个reject的返回值作为参数
- 代码
const p1 = new Promise((resolve, reject) => { setTimeout(() => { resolve("p1 resolve") }, 3000) }) const p2 = new Promise((resolve, reject) => { setTimeout(() => { resolve("p2 resolve") }, 2000) }) const p3 = new Promise((resolve, reject) => { setTimeout(()=> { resolve("p3 resolve") }, 5000) }) Promise.all([p1, p2, p3]).then(res => { console.log("all promise res:", res) }).catch(err => { console.log("all promise err", err) }) //all promise res: (3) ['p1 resolve', 'p2 resolve', 'p3 resolve']const p1 = new Promise((resolve, reject) => { setTimeout(() => { resolve("p1 resolve") }, 3000) }) const p2 = new Promise((resolve, reject) => { reject("error") }) const p3 = new Promise((resolve, reject) => { setTimeout(()=> { resolve("p3 resolve") }, 5000) }) Promise.all([p1, p2, p3]).then(res => { console.log("all promise res:", res) }).catch(err => { console.log("all promise err", err) }) // all promise err error
- allSettled方法
- all方法的缺点： 当其中有一个promise变成reject状态的时候，新的promise就会变成对应的reject状态
- 对于任然处于resolved的，以及正在处于pending状态的promise，是得不到对应的结果的
- allSettled中，添加了新的api，promise.allSettled
- 该方法会让所有的promise都有结果，无论是fulfilled， 还是rejected时， 才会有最终的状态
- 并且这个promise的结果一定是fulfilled
- 代码
const p1 = new Promise((resolve, reject) => { setTimeout(() => { resolve("p1 resolve") }, 1000) }) const p2 = new Promise((resolve, reject) => { // reject("error") setTimeout(() => { resolve("p2 resolve") }, 1000) }) const p3 = new Promise((resolve, reject) => { setTimeout(()=> { resolve("p3 resolve") }, 1000) }) Promise.allSettled([p1, p2, p3]).then(res => { console.log("all promise res:", res) }).catch(err => { console.log("all promise err", err) }) //all promise res: // (3) [{…}, {…}, {…}] // 0 // : // {status: 'fulfilled', value: 'p1 resolve'} // 1 // : // {status: 'fulfilled', value: 'p2 resolve'} // 2 // : // {status: 'fulfilled', value: 'p3 resolve'} // length // : // 3
- all方法的缺点： 当其中有一个promise变成reject状态的时候，新的promise就会变成对应的reject状态
- race 方法
- promise.race只要有一个promise对象进入fulfilled或者rejected状态的话，就会进行后面的处理
- 代码
const p1 = new Promise((resolve, reject) => { setTimeout(() => { // resolve("p1 resolve" reject("p1 reject") }, 1000) }) const p2 = new Promise((resolve, reject) => { // reject("error") setTimeout(() => { resolve("p2 resolve") }, 1000) }) const p3 = new Promise((resolve, reject) => { setTimeout(()=> { resolve("p3 resolve") }, 1000) }) // 会等到一个promise有结果，无论这个结果是fulfilled还是rejected Promise.race([p1, p2, p3]).then(res => { console.log("race Promise", res) }).catch(err => { console.log("race promise err",err) }) //race promise err p1 reject
- any方法
- any方法如果得到要给fulfilled状态，才会决定新promise的状态
- 如果所有的promise都是reject的，也会等所有的promise都变成reject状态
- 如果所有的promise都是reject的，那么会报一个AggregateError的错误
- 代码
const p1 = new Promise((resolve, reject) => { setTimeout(() => { // resolve("p1 resolve" reject("p1 reject") }, 1000) }) const p2 = new Promise((resolve, reject) => { // reject("error") setTimeout(() => { resolve("p2 resolve") }, 1000) }) const p3 = new Promise((resolve, reject) => { setTimeout(()=> { resolve("p3 resolve") }, 1000) }) Promise.any([p1, p2, p3]).then(res => { console.log("any promise res: ",res) }) //any promise res: p2 resolveconst p1 = new Promise((resolve, reject) => { setTimeout(() => { // resolve("p1 resolve" reject("p1 reject") }, 1000) }) const p2 = new Promise((resolve, reject) => { // reject("error") setTimeout(() => { reject("p2 reject") }, 1000) }) const p3 = new Promise((resolve, reject) => { setTimeout(()=> { reject("p3 reject") }, 1000) }) Promise.any([p1, p2, p3]).then(res => { console.log("any promise res: ",res) }) // AggregateError: All promises were rejected
131
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
