- A+
前言 : 个人总结，不是教程，如有错误，欢迎各位批评指正。
主要作用:
解决回调地狱
简单使用
// 创建Promise let p = new Promise((resolve, reject) => { let i = Math.random(); if (i < 0.5) resolve("a"); else reject("b"); }); // resolve传递的参数进入第一个回调函数，reject传递的进入第二个回调函数 p.then((arg) => console.log("resolve === ",arg), (arg) => console.log("reject === ",arg)); // 与上面代码等价 p.then((arg) => console.log("resolve === ",arg)).catch((arg) => console.log("reject === ",arg))
Promise属性
PromiseState:
1.padding : 未决定
2.resolved / fullfilled : 成功
3.rejected 失败
resolve/reject调用前状态为pending, 调用后分别对应状态 2 , 3
promise中抛出错误会将promise状态改变为rejected
PromiseResult
保存着 resolve/reject调用时 传递的结果
工作流程
方法
Promise.resolve(value)
作用:用于快速创建Promise,如果传入的参数为非promise，则返回一个fullfilled类型的,值为value的promise。若传入值为promise，则返还的promise状态与值与传入的promise相同
let p1 = Promise.resolve(123); p1.then(console.log) // 123 let p1 = Promise.resolve(new Promise((resolve,reject) => { resolve(456); })); p1.then(console.log); // 456 let p1 = Promise.resolve(new Promise((resolve,reject) => { reject(789); })); p1.catch(console.log) // 789
Promise.reject(value)
作用:用于快速创建Promise,如果传入的参数为非promise，则返回一个rejected类型的,值为value的promise。若传入值为promise，则返还类型为rejected，值为传入的promise的promise对象
let p1 = Promise.reject(new Promise((resolve,reject) => { resolve(123); })); p1.catch(console.log) // Promise { 123 }
Promise.all(promises)
作用:传入promises数组，若promises全为fullfilled类型，返回类型为fullfilled，值为promises结果组成的数组。若有一个失败，则返回类型为rejected，值为按数组传入顺序第一个失败的promise的值
let p1 = Promise.resolve("hello"); let p2 = Promise.resolve("a"); let p3 = Promise.resolve("b"); Promise.all([p1,p2,p3]).then(console.log); // [ 'hello', 'a', 'b' ] p1 = Promise.resolve("hello"); p2 = Promise.reject("a"); p3 = Promise.reject("b"); Promise.all([p1,p2,p3]).catch(console.log); // a
Promise.all(promises)
作用:传入promises数组，返还第一个改变状态的promise的状态与值
let p1 = new Promise((resolve, reject) => { resolve("ok"); }) let p2 = Promise.resolve("a"); let p3 = Promise.resolve("b"); Promise.race([p1, p2, p3]).then(console.log); // ok p1 = new Promise((resolve, reject) => { setTimeout(() => { resolve("ok"); }, 1000); }) p2 = Promise.resolve("a"); p3 = Promise.resolve("b"); Promise.race([p1, p2, p3]).then(console.log); // a
then 方法:
let p = Promise.resolve("ok"); let p1 = p.then(value => { console.log(value); }) console.log(p1); /** Promise {<pending>} __proto__: Promise [[PromiseState]]: "fulfilled" [[PromiseResult]]: undefined */ let p = Promise.resolve("ok"); let p1 = p.then(value => { throw("wrong") }) console.log(p1) /** Promise {<rejected>: "wrong"} __proto__: Promise [[PromiseState]]: "rejected" [[PromiseResult]]: "wrong" */ let p = Promise.resolve("ok"); let p1 = p.then(value => { return "ok" }) console.log(p1) /** Promise {<pending>} __proto__: Promise [[PromiseState]]: "fulfilled" [[PromiseResult]]: "ok" */ // 返回promise 则p1即为返回的promise 代码略
注意：
1.利用then方法返回新的promise可以进行then的链式调用，链式调用中存在异常穿透，即只需在最后直接catch，即可捕获所有then中可能出现的异常
2.中断promise.then的链式调用，在其中一个then中返还一个pending状态的promise即可， new Promise(() => {});
async & await:
async: 修饰一个函数，根据返回值构建出一个Promise，规则同then
await:只能在async修饰的函数中调用
1.右侧值为fullfilled的promise对象，获得其值
2.右侧值为rejected的promise对象，抛出错误
3.右侧为值，直接返回该值
注意:
1.promise中的方法在被创建时会被同步执行
new Promise((resolve, reject) => { console.log(1); }); console.log(2); // 输出: 1 2
2.如果不设置回调函数，Promise 内部抛出的错误，不会反应到外部。
new Promise((resolve,reject) => { throw "出错了" }).catch(console.log) // 出错了
