6种JavaScript判断对象自身为空的方法小结

更新时间：2023年12月19日 08:26:32 作者：快乐的美男子

这篇文章主要为大家详细介绍了6种JavaScript判断对象自身为空的方法,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下

1.JSON.stringify

JSON.stringify 方法可以使对象序列化，转为相应的 JSON 格式。

const obj = {};
console.log(JSON.stringify(obj) === '{}')  // true

缺点：如果存在 undefined、任意的函数以及 symbol 值，在序列化过程中会被忽略（出现在非数组对象的属性值中时）或者被转换成 null（出现在数组中时）。

const obj = {
  a: undefined,
  b: function() {},
  c: Symbol()
}

console.log(JSON.stringify(obj) === '{}')  // true

2. for in 配合 hasOwnProperty

使用 for in 对当前对象进行遍历：

const obj = {}
Object.prototype.a = 1

function isEmptyObj(obj) {
  let flag = true
  for (let o in obj) {
    flag = false
    break
  }
  return flag
}

console.log(isEmptyObj(obj))  // false

由于 for in 在进行对象遍历时，会遍历对象原型上的属性，而我们只希望得到其自身的属性，这时可以使用 hasOwnProperty 来实现，如下：

const obj = {}
Object.prototype.a = 1

function isEmptyObj(obj) {
  let flag = true
  for (let o in obj) {
    if (obj.hasOwnProperty(o)) {
      flag = false
      break
    }
  }
  return flag
}

console.log(isEmptyObj(obj))  // true

缺点：for in 不能遍历不可枚举的属性。

3. Object.keys

Object.keys 会返回对象自身可枚举属性组成的数组，而不会遍历原型上的属性。

const obj = {}
Object.prototype.a = 1

console.log(Object.keys(obj).length === 0)  // true

缺点：Object.keys 和 for in 都只能遍历可枚举属性，不能遍历不可枚举的属性。

我们使用 Object.defineProperty 将属性 enumerable 设置为 false 来进行测试，示例如下：

const obj = {}
Object.defineProperty(obj, 'a', {
  value: 1,
  enumerable: false
})

console.log(obj.a)  // 1
console.log(isEmptyObj(obj))  // true
console.log(Object.keys(obj).length === 0)  // true

4. Object.getOwnPropertyNames

使用 Object.getOwnPropertyNames 可以得到对象自身的所有属性名组成的数组(包括不可枚举属性)。

const obj = {}
Object.defineProperty(obj, 'a', {
  value: 1,
  enumerable: false
})

console.log(Object.getOwnPropertyNames(obj))  // [ 'a' ]

缺点：不能获取 Symbol 值作为名称的属性，以上的 JSON.stringify、for in 以及 Object.keys 方法也不能获取Symbol 值作为名称的属性，示例如下：

const a = Symbol()
const obj = {
  [a]: 1
}

console.log(obj)  // { [Symbol()]: 1 }
console.log(Object.getOwnPropertyNames(obj).length === 0)  // true
console.log(JSON.stringify(obj) === '{}')  // true
console.log(isEmptyObj(obj))  // true
console.log(Object.keys(obj).length === 0)  // true

5. Object.getOwnPropertyNames 结合 Object.getOwnPropertySymbols

已知 Object.getOwnPropertyNames 唯一的缺点是不能获取 Symbol 值作为名称的属性，而 Object.getOwnPropertySymbols 只能获取由 Symbol 值作为名称的属性，两者相结合是不是就可以完美解决了。我们来简单测试一下：

const a = Symbol()
const obj1 = {
  [a]: 1
}
const obj2 = {b: 2}
const obj3 = {}
Object.defineProperty(obj3, 'a', {
  value: 1,
  enumerable: false
})
const obj4 = {}

function getLength(obj) {
  return Object.getOwnPropertyNames(obj).concat(Object.getOwnPropertySymbols(obj)).length
}

console.log(getLength(obj1) === 0)  // false
console.log(getLength(obj2) === 0)  // false
console.log(getLength(obj3) === 0)  // false
console.log(getLength(obj4) === 0)  // true

经过测试，上面这种方法的确可以解决，但是比较繁琐，那有没有更好的方法呢？答案是有的。

6. Reflect.ownKeys

Reflect.ownKeys 方法返回一个由目标对象自身的属性组成的数组，它的返回值等同于 Object.getOwnPropertyNames(target).concat(Object.getOwnPropertySymbols(target))，示例如下：

const a = Symbol()
const obj1 = {
  [a]: 1
}
const obj2 = {b: 2}
const obj3 = {}
Object.defineProperty(obj3, 'a', {
  value: 1,
  enumerable: false
})
const obj4 = {}

console.log(Reflect.ownKeys(obj1).length === 0)  // false
console.log(Reflect.ownKeys(obj2).length === 0)  // false
console.log(Reflect.ownKeys(obj3).length === 0)  // false
console.log(Reflect.ownKeys(obj4).length === 0)  // true

最后

判断一个对象是否为空时，使用 Reflect.ownKeys 方法最为完美。

到此这篇关于6种JavaScript判断对象自身为空的方法小结的文章就介绍到这了,更多相关JavaScript判断对象为空内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

JavaScript 冒泡排序和选择排序的实现代码
本文通过实例代码给大家介绍了js冒泡排序和选择排序的实现代码，代码简单易懂，非常不错，具有参考借鉴价值，感兴趣的朋友一起学习吧
2016-09-09
使用SpreadJS快速清除Excel中工作表保护密码
这篇文章主要为大家介绍了使用SpreadJS快速清除Excel中工作表保护密码方法详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
2023-11-11
基于element UI input组件自行封装“数字区间”输入框组件的问题及解决
这篇文章主要介绍了基于element UI input组件自行封装“数字区间”输入框组件,实现代码可以分为两块一块为组件的封装代码，一块为文中实现效果的演示代码，对element UI数字区间输入组件相关知识感兴趣的朋友一起看看吧
2022-05-05
超详细小程序定位地图模块全系列开发教学
这篇文章主要介绍了超详细小程序定位地图模块全系列开发教学，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-11-11
JS层移支示例代码
JS层移支示例代码...
2007-03-03
xml和web特殊字符
在html和xml文件中，往往会因为以下特殊字符而导致文件解析出错，一般通过以下函数来处理。
2009-04-04
Ionic2调用本地SQlite实例
这篇文章主要介绍了Ionic2调用本地SQlite实例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-04-04
js实现Element中input组件的部分功能并封装成组件(实例代码)
这篇文章主要介绍了纯生js实现Element中input组件的部分功能（慢慢完善）并封装成组件,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2021-03-03
js实现滚动条自动滚动到最底部示例代码
这篇文章主要给大家介绍了关于js实现滚动条自动滚动到最底部的相关资料,文中通过实例代码介绍的非常详细,对大家学习或者使用js具有一定的参考学习价值,需要的朋友可以参考下
2023-06-06
JavaScript之事件循环案例讲解
这篇文章主要介绍了JavaScript之事件循环案例讲解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下
2021-07-07