我正在参与AdminJS会员专属活动-源码共读第一期,点击参与
前言
本来在周末应该将axios
的剩下一些阅读笔记整理出来,但是由于手头上工作项目的问题而导致耽误了。不过问题不大,该来的总会来,第二弹就这样“延期而至”。
源码阅读
由于上周已经阅读过一部分axios
源码,我已经对它有了一定了解,所以这次会比较轻松一点。它里面包含了很多工具,值得我们花时间去阅读。上周介绍了比较陌生的函数,这次来介绍一些常用的工具函数。
isDate
function isDate(val) {
return toString.call(val) === "[object Date]";
}
这个函数借助 toString() 判断属性类型的性质判断 val 是否为日期类型。
isFile
function isFile(val) {
return toString.call(val) === "[object File]";
}
和 isDate 一样,都是借助了 toString() 来判断属性类型。其实看了剩下的关于判断类型的工具函数,不难发现都是使用 toString()。
isFunction
function isFunction(val) {
return toString.call(val) === "[object Function]";
}
通过 toString() 判断属性类型的性质判断 val 是否为函数类型。
isNumber
function isNumber(val) {
return typeof val === "number";
}
这个则是通过 typeof 来判断是否为 number 类型
isObject
function isObject(val) {
return val !== null && typeof val === "object";
}
它会判断传入值是否是普通对象,通过排除掉 null 类型之外的所有对象类型。
forEach
function forEach(obj, fn) {
if (obj === null || typeof obj === "undefined") {
return;
}
if (typeof obj !== "object") {
obj = [obj];
}
if (isArray(obj)) {
for (var i = 0, l = obj.length; i < l; i++) {
fn.call(null, obj[i], i, obj);
}
} else {
for (var key in obj) {
if (Object.prototype.hasOwnProperty.call(obj, key)) {
fn.call(null, obj[key], key, obj);
}
}
}
}
我们经常使用的 forEach 函数的代码如上所示。我们来理一理它的逻辑。如果是 null 或 undefined 则直接返回。如果是 Array 类型就开始循环遍历。如果是 Object 类型则使用 hasOwnProperty() 方法来进行遍历。这就是 forEach 的内部实现流程逻辑。并不难理解,很容易看明白。
extend
function extend(a, b, thisArg) {
forEach(b, function assignValue(val, key) {
if (thisArg && typeof val === "function") {
a[key] = bind(val, thisArg);
} else {
a[key] = val;
}
});
return a;
}
可以因名思其功能,它的中文意思是扩展,因此它有着扩展的功能,用于扩展对象。通俗点理解就是它可以将 a 的所有属性扩展到 b 上。
总结
以上就是我这次研究的剩下的一些工具函数了,这次我是第二次阅读 axios
的工具函数库源码,又加深了一遍印象。通过这次阅读,我也发现了 axios
的工具函数大部分都是用于判断各种数据类型。这些方法都可以在项目直接参考使用。
最后,源码阅读是个漫长的过程,需要慢慢研读。阅读源码的过程可以获到很多额外知识。
上期回顾:这些个 axios 工具函数,你都掌握了吗