axios源码记录笔记

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第18天，点击查看活动详情

前言

最近都再看算法的内容，突然发现自己axios方面的知识还没有学习好，也攒下了不少偏笔记，在这里浅浅记录一下自己学习的历程。

axios 初始化

当我们npm install axios后，打开axios的 package.json可以找得到axios的入口文件 "main": "index.js"

我们顺着这个文件去一步步理清axios的内容

index.js

随之我们进入index.js的文件中

axios.js

文件最上面的部分是各种文件的引入，包括配默认置文件，工具函数，Axios主文件

下面的部分中可以看得出来，axios是一个函数。

函数的内容如图

• 定义了一个 Axios实例

• 使用bind函数创建instance，返回一个新的 wrap 函数，

• 使用extend函数将Axios原型和实例上的内容绑定到instance上，

  • 也就是为什么 有 axios.get 等别名方法
  • 也就是为什么默认配置 axios.defaults 和拦截器 axios.interceptors 可以使用的原因

• 定义调用axios.create()时执行的内容

• 最后返回实例对象

剩下的文件中的部分就是为 axios函数添加方法

工具函数

源码中有一些自定义的工具函数，和平时我们认知的有一点不一样，把他们单独拿出来讲一下

bind函数

这里重写的bind函数并不像我们平时的bind函数一样，参数的位置有一丢丢不一样，但也容易理解

utils.extend

我们再utils文件中找到extend项

forEach

加了大量的注释，应该一下子就能看懂了，

调用forEach时

forEach(遍历的内容,处理的函数(值，索引，遍历的内容){处理细节}, 是否全是自身的key)

看完这三个 方法工具 上面的 createInstance函数应该就能看懂了

merge

把多个对象的值都放到一起来。