JS28 判断对象是空对象

概述

一个空的对象{}在JS中进行判断，显示为真值：

var a = {};
console.log(!!a) //  true

所以要判断对象中是否含有属性，需要使用特殊的手段，不同情况下有不同的手段：

1. Reflect.ownKeys()
2. JSON.stringify
3. Object.keys/Object.values/Object.entries
4. Object.getOwnPropertyNames()
5. for...in
6. 其他方法

这里判断对象是否是空对象，应该刨除原型链继承的影响，只观察对象自身是否含有任意属性值。

基于这个前提下，我认为可能Reflect.ownKeys()是更恰当的方法。

遍历方法的区别

先来看一下各种遍历方法的区别：

	自身属性	原型属性	可枚举属性	不可枚举属性	Symbol属性
for...in	√	√	√	×	×
Object.getOwnPropertyNames	√	×	√	√	×
Object.keys	√	×	√	×	×
Relect.ownKeys	√	×	√	√	√

Reflect.ownKeys(target)

Relfect对象是ES6为操作对象提供的新API，它提供了许多针对对象的操作方法，其中ownKeys用于返回对象的所有属性，基本等同于Object.getOwnPropertyNames与Object.getOwnPropertySymbols之和。

它与其他的遍历方法最大的不同就是，它会将对象中Symbol类型的属性名遍历出来，而其他的方法不会。

function isEmpty(obj) {
  return Reflect.ownKeys(obj).length === 0
}

其他的方法都有着自己的局限性。

Object.keys()

Object.keys()方法返回的数组中只包括自身可枚举的属性，不可枚举属性和Symbol属性都包括在返回结果中

Object.getOwnPropertyNames()

Object.getOwnPropertyNames()返回的结果中包含自身可枚举和不可枚举的属性，但是不包含Symbol属性

它与Object.keys()相比，返回结果增加了自身不可枚举的属性

for...in

利用for...in对对象进行遍历时，会返回自身以及原型链上的可枚举属性，返回结果不包含Symbol属性

我们这里的前提是不考虑原型链继承而来的属性，所以即便不考虑Symbol属性，也需要通过hasOwnProperty判断遍历的结果是继承自原型链还是属于自身的属性

JSON.stringify()

JSON.stringify()方法可以将对象序列化为字符串，但是在序列化过程中会忽略方法属性和Symbol属性

const a = {
  [Symbol(123)]: 123,
  say() {}
};
console.log(JSON.stringify(a)) // '{}'

Lodash的isEmpty方法

使用Lodash的isEmpty判断对象是否是空对象时，对象如果被认为为空，那么他们没有自己的可枚举属性的对象。

它对字符串、数组、类数组对象也考虑在内了，如果这些对象长度为0，就认为是空对象

对于Map和Set对象，如果其size为0，就认为是空对象

看一下它的源码：

/**
 * Checks if `value` is an empty object, collection, map, or set.
 *
 * Objects are considered empty if they have no own enumerable string keyed
 * properties.
 *
 * Array-like values such as `arguments` objects, arrays, buffers, strings, or
 * jQuery-like collections are considered empty if they have a `length` of `0`.
 * Similarly, maps and sets are considered empty if they have a `size` of `0`.
 *
 * @static
 * @memberOf _
 * @since 0.1.0
 * @category Lang
 * @param {*} value The value to check.
 * @returns {boolean} Returns `true` if `value` is empty, else `false`.
 * @example
 *
 * _.isEmpty(null);
 * // => true
 *
 * _.isEmpty(true);
 * // => true
 *
 * _.isEmpty(1);
 * // => true
 *
 * _.isEmpty([1, 2, 3]);
 * // => false
 *
 * _.isEmpty({ 'a': 1 });
 * // => false
 */
function isEmpty(value) {
  // 对于null也认为是空对象，返回true
  if (value == null) {
    return true;
  }
  // 对数组/类数组对象/字符串/Buffer/arguments对象，根据length属性进行判断
  if (isArrayLike(value) &&
    (isArray(value) || typeof value == 'string' || typeof value.splice == 'function' ||
      isBuffer(value) || isTypedArray(value) || isArguments(value))) {
    return !value.length;
  }
  // 主要是通过Object.prototype.toString.call返回类型
  var tag = getTag(value);
  // 针对Map和Set对象，根据size属性进行判断
  if (tag == mapTag || tag == setTag) {
    return !value.size;
  }
  // 针对原型对象，利用for...in遍历，返回自身除了constructor之外的属性
  if (isPrototype(value)) {
    return !baseKeys(value).length;
  }
  // 针对普通对象，利用for...in循环
  for (var key in value) {
    if (hasOwnProperty.call(value, key)) {
      return false;
    }
  }
  return true;
}

发现它使用的是for...in来进行主要的判断，对Symbol属性也没有进行判断

const key = Symbol(123);
const a= {[key]: 33};
console.log(_.isEmpty(a)); // true

参考

• Reflect@ECMAScript6入门
• isEmpty@Lodash
• Object.keys()@MDN