字体包体积压缩实践

这篇博客针对axios库的核心代码做一个简要总结

一、关键步骤

1.创建axios对象

axios库导出的对象是一个已经被创建好的axios对象，它本质上是一个方法，可以直接接收一个config配置参数进行请求。在库的入口处，即可看到如下代码：

function createInstance(defaultConfig) {// 传入默认配置生成axios对象const context = new Axios(defaultConfig);// 本质是request方法，this上下文绑定contextconst instance = bind(Axios.prototype.request, context);// 将Axios原型上的属性复制到instanceutils.extend(instance, Axios.prototype, context, {allOwnKeys: true});// 将context上的属性复制到instanceutils.extend(instance, context, {allOwnKeys: true});// 暴露create工厂方法供外部创建自定义的axios对象instance.create = function create(instanceConfig) {return createInstance(mergeConfig(defaultConfig, instanceConfig));};return instance;
}
// 默认暴露的axios对象
const axios = createInstance(defaults); 

上述代码是创建默认axios对象的流程，这个对象上有Axios类的实例属性以及原型上的方法，且自身的是一个request方法，整个库最核心的也就是这个request方法。

2.请求

Axios的原型上存在很多辅助方法，如get，post，put等等，这些方法最终都会调用request方法，且默认设置了请求参数中的method属性，仅仅是一种封装的快捷调用方式。所以直接使用axios方法(axios的本质是一个方法)，传入一个合法参数和使用axios.get等方法进行请求没有区别。

二、Axios类

1.基础属性

axios类型的对象，存在2个基础属性

• defaults：默认的请求参数
• interceptors：请求和响应的拦截器

2.辅助方法

axios类型的对象存在很多辅助方法，如下：

• delete
• get
• head
• options
• post
• put
• patch
• postForm
• patchForm
• putForm

这些方法本质上都是request的封装，调用这些方法时