js-如何判断js数据类型

js是弱类型的语言,它的变量没有类型约束,我们可以组合使用如下5个工具来做类型判断。

  1. typeof。判断字符串,函数,Symbol。
  2. instanceof。能检测出引用类型,判断日期
  3. Array.isArray。判断数组
  4. Object.prototype.toString.call。判断其他没有专门工具判断的数据类型,例如 Map, Set, Object等。
  5. constructor  除了null和undefined都可以判断

区别和优缺点:                                 

                                                               优点                                          缺点

typeof                                                 使用简单                         只能检测出基本类型(出null)
instanceof                                     能检测出引用类型            不能检测出基本类型,且不能跨iframe
constructor              基本能检测出所有类型除了null和undefined      易被修改,也不能跨iframe

Object.prototype.toString.cal         检测出所有的类型             IE6下,undefined和null均为Object

如下代码是从vue3的源码中摘录的。可以参考使用。

  
  const objectToString = Object.prototype.toString;
  const toTypeString = (value) => objectToString.call(value);
  
  // 是否数组
  const isArray = Array.isArray;
  // 是否Map
  const isMap = (val) => toTypeString(val) === '[object Map]';
  // 是否Set
  const isSet = (val) => toTypeString(val) === '[object Set]';
  // 是否日期
  const isDate = (val) => val instanceof Date;
  // 是否函数
  const isFunction = (val) => typeof val === 'function';
  // 是否字符串
  const isString = (val) => typeof val === 'string';
  // 是否Symbol
  const isSymbol = (val) => typeof val === 'symbol';
  // 是否对象(不能是nul)
  const isObject = (val) => val !== null && typeof val === 'object';
  // 是否Promise
  const isPromise = (val) => {
      return isObject(val) && isFunction(val.then) && isFunction(val.catch);
  };
  // 工具方法:获取类型字符串
  const toRawType = (value) => {
      // extract "RawType" from strings like "[object RawType]"
      return toTypeString(value).slice(8, -1);
  };
  // 是否纯对象
  const isPlainObject = (val) => toTypeString(val) === '[object Object]';
  // 是否是整数字符串
  const isIntegerKey = (key) => isString(key) &&
      key !== 'NaN' &&
      key[0] !== '-' &&
      '' + parseInt(key, 10) === key;


版权声明:本文为weixin_62930485原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。