Promise深入笔记
前言
本文作为本人学习总结之用，以笔记为主，同时分享给大家. .
因为个人技术有限，如果有发现错误或存在疑问之处，欢迎指出或指点！不胜感谢！
Promise的理解和使用
Promise是什么?
抽象表达:
Promise是JS中进行异步编程的新的解决方案(旧的是什么?)
旧方案是单纯使用回调函数具体表达:
从语法上来说: Promise是一个构造函数
从功能上来说: promise对象用来封装一个异步操作并可以获取其结果promise的状态改变(只有2种, 只能改变一次)
pending变为resolved
pending变为rejectedpromise的基本流程
为什么要用Promise?
1.指定回调函数的方式更加灵活:
可以在请求发出甚至结束后指定回调函数
之前 必须在启动异步任务前指定
promise: 启动异步任务 => 返回promie对象 => 给promise对象绑定回调函 数(甚至可以在异步任务结束后指定/多个)
2. 支持链式调用, 可以解决回调地狱问题
什么是回调地狱?
回调函数嵌套调用, 外部回调函数异步执行的结果是嵌套的回调执行的条件回调地狱的缺点?
不便于阅读 不便于异常处理解决方案?
promise 链式调用终极解决方案?
async/await
如何使用 Promise?
API
Promise构造函数: Promise (excutor) {}
excutor函数: 同步执行 (resolve, reject) => {}
resolve函数: 内部定义成功时我们调用的函数 value => {}
reject函数: 内部定义失败时我们调用的函数 reason => {}
说明: excutor会在Promise内部立即同步回调,异步操作在执行器中执行Promise.prototype.then方法: (onResolved, onRejected) => {}
onResolved函数: 成功的回调函数 (value) => {}
onRejected函数: 失败的回调函数 (reason) => {}
说明: 指定用于得到成功value的成功回调和用于得到失败reason的失败回调
返回一个新的promise对象Promise.prototype.catch方法: (onRejected) => {}
onRejected函数: 失败的回调函数 (reason) => {}
说明: then()的语法糖, 相当于: then(undefined, onRejected)Promise.resolve方法: (value) => {}
value: 成功的数据或promise对象
说明: 返回一个成功/失败的promise对象Promise.reject方法: (reason) => {}
reason: 失败的原因
说明: 返回一个失败的promise对象Promise.all方法: (promises) => {}
promises: 包含n个promise的数组
说明: 返回一个新的promise, 只有所有的promise都成功才成功, 只要有一个失败了就直接失败Promise.race方法: (promises) => {}
promises: 包含n个promise的数组
说明: 返回一个新的promise, 第一个完成的promise的结果状态就是最终的结果状态
new Promise((resolve, reject) => { setTimeout(() => { // resolve('成功的数据') reject('失败的数据') }, 1000) }).then( value => { console.log('onResolved()1', value) } ).catch( reason => { console.log('onRejected()1', reason) } ) // 产生一个成功值为1的promise对象 const p1 = new Promise((resolve, reject) => { setTimeout(() => { resolve(1) }, 100); }) const p2 = Promise.resolve(2) const p3 = Promise.reject(3) p1.then(value => {console.log(value)}) p2.then(value => {console.log(value)}) p3.catch(reason => {console.log(reason)}) //以上输出 2 3 1 // const pAll = Promise.all([p1, p2, p3]) const pAll = Promise.all([p1, p2]) pAll.then( values => { console.log('all onResolved()', values) //[1, 2] }, reason => { console.log('all onRejected()', reason) } ) const pRace = Promise.race([p1, p2, p3]) pRace.then( value => { console.log('race onResolved()', value) // 2 }, reason => { console.log('race onRejected()', reason) } )
作者：Moons
链接：https://juejin.cn/post/7018541385322233892