axios具体配置及源码解析

渴望看海的少年

于 2022-03-08 21:57:01 发布

阅读量321

点赞数

CC 4.0 BY-SA版权

分类专栏：框架文章标签： ajax javascript 前端

本文链接：https://blog.youkuaiyun.com/DespairA/article/details/123306598

框架专栏收录该内容

10 篇文章

订阅专栏

本文详细介绍了axios的基本用法，包括其作为AJAX请求库的特点，以及对axios源码中interceptors机制的深入剖析。通过实例演示了如何访问interceptors.request属性，并使用数据方法处理回调。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、axios基本使用

1.axios介绍

axios是很热门的发送Ajax请求的方式，是基于promise的，可以在nodejs中运行，支持promise的api，可以预处理，对响应提前作出准备等

二、axios源码解析

1.记录遇到的自己曾经迷惑的一个问题

有两个构造函数，实例化Axios后，实例对象上，就有了interceptors属性，而interceptor上有request属性，而将一个构造函数的实例对象赋值给request属性

此时request属性就有了WebManager构造函数上的方法x，

通过yes.interceptors.request.x 可以调用

      function WebManager() {
        this.x = [];
      }

      function Axios(instanceConfig) {
        this.interceptors = {
          request: new WebManager(),
        };
      }
      let yes = new Axios();
      console.log(yes.interceptors.request.x);

输出一个空数组

2.利用数据方法shift，每两个为一组将回调取出

 while (chain.length) {
        //依次取出 chain 的回调函数, 并执行
        promise = promise.then(chain.shift(), chain.shift());
    }

    return promise;