isEmpty工具函数

背景

在**项目开发中，需要在对未知数据类型做判空处理，期待空值列表：undefined、null、''、NaN、[]、{}, 注意非空： 0、false；

而常见的lodash.isEmpty, !value均不能直接满足我们的需求，那么我们需要抽离一个工具函数isEmpty;

常见使用场景

接口返回表格字段的数据:

表格中使用switch: 0(或者false)表示禁用，1(或者true)表示启用，undefined 表示该字段无值；

表格中使用tag: 多个tag使用数组表示['王小虎'、'张春阳'], [] || null 表示该字段无值；

即在常见的后端接口返回表格数据中需要满足该需求定义的空值。

需求

传入任意类型数据根据需求返回是否为空;

期待空值列表：undefined、null、''、NaN、[]、{}, 注意非空： 0、false；

其他类型默认返回false；(传入任意类型数据不报错)

对比lodash.isEmpty与!value

	undefined	null	''	[]	{}	NaN	0	false	备注
lodash.isEmpty	true	true	true	true	true	true // 不支持判断number类型	true // 不支持判断number类型	true // 不支持判断Boolean类型	传入不支持数据类型时返回true
!value	true	true	true	false	false	true	true	true	传入其他数据类型时返回false

lodash.isEmpty

/**
    官网描述：检查 value 是否为一个空对象，集合，映射或者set。 判断的依据是除非是有枚举属性的对象，length 大于 0 的 arguments object, array, string 或类jquery选择器。
*/
 * _.isEmpty(null);
 * // => true
 *
 * _.isEmpty(true);
 * // => true
 *
 * _.isEmpty(1);
 * // => true
 *
 * _.isEmpty([1, 2, 3]);
 * // => false
 *
 * _.isEmpty({ 'a': 1 });
 * // => false
 */
function isEmpty(value) {
  if (value == null) {
    return true;
  }
  if (isArrayLike(value) &&
      (isArray(value) || typeof value == 'string' || typeof value.splice == 'function' ||
        isBuffer(value) || isTypedArray(value) || isArguments(value))) {
    return !value.length;
  }
  var tag = getTag(value);
  if (tag == mapTag || tag == setTag) {
    return !value.size;
  }
  if (isPrototype(value)) {
    return !baseKeys(value).length;
  }
  for (var key in value) {
    if (hasOwnProperty.call(value, key)) {
      return false;
    }
  }
  return true;
}

cdn.jsdelivr.net/npm/lodash@…

观察数据类型及其对应业务空值

由下图可知，我们仅关心js中的部分数据类型及其对应的值

设计思路

1. 得到数据的数据类型 [1]

   [1] ： 重温js数据类型及数据类型的判断方式

2. 判断是否是对应类型的空值，哪些需要注意不是空值

3. 保证传入任意数据类型不报错

实现

// 空值： [undefined, null, NaN, [], {}], 注意非空：0, false;
function isEmpty(value) {
  switch (Object.prototype.toString.call(value)) {
    case '[object Undefined]':
      return value === void 0;
    case '[object Null]':
      return value === null;
    case '[object Number]':
      return isNaN(value);
    case '[object String]':
      return value === "";
    case '[object Boolean]':
      return false;
    case '[object Object]':
      return Object.keys(value).length === 0;
    case '[object Array]':
      return value.length === 0;
    default:
      return false;
  }
}

相关资料

[1] 数据类型