基础知识
1、同步回调和异步回调的区别
2、JS 中的 Error 相关知识
一、promise 的基本理解和使用
1、基本概念
2、基本特点
3、基本流程
new 一个 promise 实例对象后,紧接着发生的基本流程如下 :
4、基本使用
<script>
/*
1. 创建一个promise实例,这时为 pending状态,
构造函数 Promise的参数是执行器函数 executor,一般写成箭头函数的形式
*/
const p = new Promise((resolve, reject) => {
// 2.在执行器函数中启动异步任务
setTimeout(() => {
const start = Date.now()
if (start % 2) {
// 3.如果成功,调用 resolve函数 ,
// 状态变为 fulfilled(resolvecd),value为成功的值 'ok'
resolve('ok');
}else{
// 4.如果失败,调用 reject函数 ,
// 状态变为 rejected,reason为失败的值 'error'
reject('error')
}
}, 1000)
})
/*
5. 状态变化后,执行then方法,
如果是成功的状态,则调用第一个函数,否则调用第二个函数,来获取成功或失败的值
*/
p.then(value =>{
// 成功的回调函数 onResolved, 得到成功的 vlaue
console.log('success:' + value)
},reason =>{
// 失败的回调函数 onRejected, 得到失败的 reason
console.log('fail:' + reason)
})
</script>
then() 方法的执行结果如下:
二、为什么要使用 promise
1、支持链式调用,解决“ 回调地狱 ”
在 promise 出现之前,解决异步编程的方法是使用传统的回调函数和事件。传统的回调函数会出现“回调地狱”:回调函数嵌套调用, 外层回调函数异步执行的结果是嵌套的内层回调执行的条件。
回调地狱:
request1(function(result1){
request2(result1,function(result2){
request3(result2,function(result3){
// do something...
console.log(result3)
})
})
})
嵌套使用回调函数,还有以下的弊端:
解决方案:可以使用 promise 链式调用的方式解决该问题。
request1.then(result =>{
return request2(result)
}).then(newResult =>{
return request3(newResult)
})
2、指定回调函数的方式更加灵活
传统的方式,必须在启动异步任务前指定回调函数,使用 promise 后,启动异步任务后,返回promise 对象,再给这个对象绑定回调函数。
三、promise 有什么弊端
Promise 解决了传统 callback 函数导致的“回调地狱”问题,但它的语法,导致了它纵向发展形成了回调链,在业务比较复杂庞大时,这种写法也不简介方便。
解决方案:使用 async await