基于 TypeScript重构Axios-进阶功能(拦截器实现)

拦截器其实就是利用promise链式调用+数组属性实现的一个链式调用的类，类中抛出use事件提供给开发者调用实现，并通过设置interceptors数组依次调用相关事件

在Axios对象中有一个interceptors对象，对象有拥有request和response两个属性，他们都有共同的一个use方法，其支持两个函数，有点像promise中的resolve和reject,开发中通常在这两个函数中实现同/异步事件

在系统实践中我们是可以设置多个拦截器的，拦截器对于request请求前呈后添加先执行的顺序，对于response则是响应后先添加先执行

promise 是一个构造函数，接受一个函数作为参数，返回一个promise实例，promise含有3种状态，分别为Pending、resolve、reject代表进行中、已成功、已失败，实例只能由pending转为resolve或者reject，且过程不可逆，状态的改变通过resolve、reject来实现，他在原型上定义了then和catch方法来为两个状态的改变注册回调事件，该回调函数属于微任务，会在本轮事件循环的末尾执行(但其执行顺序高于宏任务，微任务和宏任务两者的区别就在于事件队列在回流重绘之前先执行微任务后执行宏任务)，async/await同步调用其实就是基于promise做的语法糖

拦截器的类其实也很简单，就是在InterceptorManager类中实例化一个存放拦截器的私有属性(数组)，并对外抛出两个事件分别use、eject给开发者使用，其中use函数是添加拦截器到interceptors中，该函数执行完毕会抛出一个id，这个id用于给eject函数删除指定拦截器，最后则是提供一个私有事件forEach执行interceptors中的所有事件

最后只需要在axios总成中添加拦截器的调用方法即可

首先要注意拦截器对于request请求前呈后添加先执行的顺序，对于response则是响应后先添加先执行，最后就是利用 while循环不断执行chain事件存储器里的每一个事件并抛出对应的回调事件