生产中如何正确检测数据的类型？

掘金萧寒
361 阅读3分钟

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

要确定如何正确检测数据类型，有以下几点我们需要明确一下：

1、 我们一般需要检测数据的类型有哪些？

我们实际生产中要检测的数据类型，不单单是js的基本数据类型，而是检测的要相对具体一些，大概要检测的数据类型有下面这些： Boolean, Number, String, Symbol, BigInt,Undefined,Null,Object,Function, Array, Date, RegExp, Error

2、常见的检测数据类型的方式有哪些？

  1. typeof
    • 使用方法： typeof a
    • 原理：typeof检测数据类型是按照二进制存储的值进行检测的
    • 优点
      1. 简单
      2. 能检测出大部分基本数据类型
    • 缺点
      1. 可以检测出大部分基本数据类型，但是typeof null的值为"object"
      2. 不能细分具体的对象数据类型值，所有对象数据类型的值，检测出来的结果都是"object"
      3. 检测构造函数创建的基本数据类型的实例，值均为"object"
  2. instanceof
    • 使用方法： a instanceof Array
    • 原理：根据原型链来进行判断，检测当前实例的__proto__上是否出现该构造函数的prototype。
    • 优点：
      1. 可以检测出比较具体的类型
    • 缺点：
      1. 原型链是可以改动的，所以其结果并不能保证十分准确
      2. 说有实例的原型链最后都会指向Object，所以“ 任何实例 instanceof Object ”都成立
      3. 字面量创建的基本数据类型值无法通过instanceof检测
    • 注意： 该方法是为了检测某个实例是否属于某个类，并不是为了检测数据类型，虽然可以使用
  3. constructor
    • 使用方法： a.constructor === Array
    • 原理：constructor。
    • 优点：
      1. 可以检测出比较具体的类型
      2. 只会检测一层，不会沿着原型链继续向上查找
    • 缺点：
      1. constructor可以改动的，所以其结果并不能保证十分准确
  4. Object.prototype.toSring.call()
    • 使用方法： Object.prototype.toSring.call(a)
    • 原理： 使用 Object 对象的原型方法 toString 来判断数据类型
    • 优点：
      1. 比较万能的
    • 缺点：
      1. 代码太多，太长了

3、编写判断数据类型函数

  1. 只判断最开始列举的数据类型
  2. Generator函数函数判断比较特殊，需要特殊处理，这里不做处理
const typeArr = ['Boolean', 'Number', 'String', 'Symbol', 'BigInt','Undefined','Null','Object','Function', 'Array', 'Date', 'RegExp',  'Error']
const typeObj = {};
typeArr.forEach(function(key){
  console.log(key)
  typeObj["[object "+key+"]"] = key.toLowerCase()
})
//typeObj将会变成{'[object Boolean]': 'boolean',...}的形式
console.log(typeObj)
function judgeType(obj){
  //undefined和null直接返回对应的字符串
  if(obj == null){
    return obj + ''
  //将对象进行细分
  }else if(typeof obj === "object"){
    return typeObj[Object.prototype.toString.call(obj)];
  //函数也可以使用typeof
  }else{
    return typeof obj;
  }
}

需要做数据类型的字典typeObj，当typeof obj === "object"就需要使用Object.prototype.toString.call(obj)来进行判断，在数据类型字典中之所以要加上基本数据类型是为了判断使用构造函数的方式创建实例对象的情景。

4、总结

很简单的一个功能，但是需要我们了解比较基础的知识，并将其进一步拆解。慢慢来，不急

avatar
文章
阅读
粉丝