前言
本系列文章是在阅读Axios源码基础上学习总结背后的实现思想。
详细内容
这部分分为两块进行介绍:
- axios源码项目核心代码的目录结构
- Axios构造函数以及通过Axios()构造函数构建axios实例
Axios项目核心
上图中是Axios项目中核心代码的目录结构
- adapters:HTTP请求的实现
- cancel:令牌取消相关的实现
- core:核心目录,axios构造函数、实例方法等的实现
- helpers:辅助工具目录
- axios.js:创建并暴露axios实例,你可以看成入口文件
- defaults.js:请求的默认配置对象
- utils.js:工具
注:具体目录下的文件的具体功能,之后分析到会具体说明其功能
axios.js
创建axios实例,并暴露该实例对象
// 该文件主要构建axios()、所有方法的暴露
// 实际上axios是一个函数,内部实际上是调用request方法
var axios = function wrap(defaults) {
return Axios.prototype.request.apply(context, [...defaults]);
};
需要关注的几点有:
在createInstance中,实际上就两个处理:
- 创建Axios实例
- 将Axios实例以及Axios.prototype上所有的方法都定义在axios上,就是在使用axios时提供的的axios.get()等别名方法。
axios.create方法实际上内部还是调用createInstance()
axios.all实际上就是Promise.all
在axios.js中实际上依赖的外部模块有:
- defaults.js默认的配置对象模块
- Axios.js核心模块,定义了Axios构造函数、request方法以及各种方式的请求
总结
从Axios项目中的流程分析可知:
axios({}).then()的使用实际上是调用Axios.prototype.request方法,axios.create()亦是
下篇文档就具体分析下request方法的具体处理流程。