第一期 axios源码常用的工具类

axios源码中那些实用的基础工具函数

今天我们看一下axios 中的utils.js 文件。基础工具函数包含了数据类型判断，typeof适用于null、object 以外的类型的判断。用 Object.prototype.toString() 方法 来判断 object 类型。

1. 类型判断
   1.1 typeof方法
   typeof运算符后可跟着一个操作数，用于判断该操作数的数据类型；typeof适用于下面7种数据类型中除null、object的其他5种类型的判断：

typeof ''; // string 有效
typeof 1; // number 有效
typeof Symbol(); // symbol 有效
typeof true; //boolean 有效
typeof undefined; //undefined 有效
typeof null; //object 无效
typeof [] ; //object 无效
typeof new Function(); // function 有效
typeof new Date(); //object 无效
typeof new RegExp(); //object 无效

1.2 Object.prototype.toString() 方法
toString() 返回一个表示该对象的字符串
对于 Object 对象，直接调用 toString() 就能返回 [object Object] 。而对于其他对象，则需要通过 call / apply 来调用才能返回正确的类型信息。call 用于指定 this。

var toString = Object.prototype.toString;
// 确定值是否为数组
function isArray(val) {
 return toString.call(val) === '[object Array]';
}
//  确定值是否为数据缓冲区
const buffer = new ArrayBuffer(8);
isArrayBuffer(buffer) // true 
function isArrayBuffer(val) {
 return toString.call(val) === '[object ArrayBuffer]';
}
// 判断时间
function isDate(val) {
 return toString.call(val) === '[object Date]';
}
//  判断文件
function isFile(val) {
 return toString.call(val) === '[object File]';
}
//  判断 Blob对象表示一个不可变、二进制原始数据的类文件对象
function isBlob(val) {
 return toString.call(val) === '[object Blob]';
}
//  判断 函数
function isFunction(val) {
 return toString.call(val) === '[object Function]';
}
//  判断是否是流
function isStream(val) {
 return isObject(val) && isFunction(val.pipe);
}
//  判断是否是流
function isURLSearchParams(val) {
 return typeof URLSearchParams !== 'undefined' && val instanceof URLSearchParams;
}

2. 其他工具函数

// trim 去除首尾空格
function trim(str) {
  return str.replace(/^\s*/, '').replace(/\s*$/, '');
}
// isStandardBrowserEnv 判断标准浏览器环境
function isStandardBrowserEnv() {
  if (typeof navigator !== 'undefined' && (navigator.product === 'ReactNative' ||
                                           navigator.product === 'NativeScript' ||
                                           navigator.product === 'NS')) {
    return false;
  }
  return (
    typeof window !== 'undefined' &&
    typeof document !== 'undefined'
  );
}
// forEach 遍历对象或数组
function forEach(obj, fn) {
  // Don't bother if no value provided
  // 如果值不存在，无需处理
  if (obj === null || typeof obj === 'undefined') {
    return;
  }

  // Force an array if not already something iterable
  // 如果不是对象类型，强制转成数组类型
  if (typeof obj !== 'object') {
    obj = [obj];
  }

  if (isArray(obj)) {
    // Iterate over array values
    // 是数组，for循环执行回调fn
    for (var i = 0, l = obj.length; i < l; i++) {
      fn.call(null, obj[i], i, obj);
    }
  } else {
    // Iterate over object keys
    // 是对象，for循环执行回调fn
    for (var key in obj) {
       // 只遍历可枚举属性
      if (Object.prototype.hasOwnProperty.call(obj, key)) {
        fn.call(null, obj[key], key, obj);
      }
    }
  }
}