首先我们了解下同步和异步的概念。
同步,就是比如执行JS代码时候要一步步严格按照先后顺序执行。遇到要下载的Script,也会等待他下载完成以后再继续往下执行。
异步,异步不会进行等待。如果遇到了这种需要等待的js执行程序,会分发出单独的一个异步任务去处理这个请求。然后继续往下执行。直到这个任务通过回调函数返回数据,再继续执行它。
Promise是ES6中一个重要特性。Promise是异步编程的解决方案。
什么时候要处理异步请求呢?
当网络请求非常复杂时候,会出现回调地狱。
啥叫做回调地狱:比如一个网络请求任务结果不止是发送一个ajax请求才能获取,要通过好多个这样的请求,并且和每个请求之间获取的数据是一环扣一环。才可以获取。好比如下截图:
像上面截图代码是非常难看不利于阅读的,如果中间程序代码又很多的话就更加不利于阅读。
那对于这种代码复杂的情况,ES6就提出了Promise的运用。
我们用定时器异步事件来模拟:
这样看上去好像代码多了且繁琐了,但是当出现多次请求时候我们就会知道这种代码结构的逻辑如此之清晰。
Promise对象是可以链式调用的。成功时候执行then里面的回调函数,失败时候执行catch里面的函数。
来自尚硅谷 Promise关于网络请求的示例图:
用promise封装AJAX请求:
Promise实例对象有3中状态:
pending 未决定
resolve或者fulfilled 成功状态
reject 失败状态
对于第三点改变promise状态和指定回调函数的谁先谁后描述,可以观察如下代码:
可以将上述结果分别打印下看下断点执行顺序就一目了然。注意,指定回调意思是指定then函数,而不是指定then函数里面的参数函数。
对于第6点,类似于这个:
关于Promise构造函数的重写。
更多的关于promise重写详情见上述链接教程。
我们来看看async异步函数:
案例:有一个需求必须拿到俩个请求,分别是请求A和请求B返回的结果,才可以满足这个需求执行下一步操作。应该怎么做?
之前的写法:
注意,上面有声明了俩个变量:
但是这样子做要申请俩个全局变量不是个很优解的方案!