如何在JavaScript中检查对象是否为空
本文将快速介绍如何在 JavaScript 中检查对象是否为空。
在日常 JavaScript 开发中,您可能需要检查对象是否为空。如果您曾经做过这件事,您可能知道没有单一的直接解决方案。但是,您可以使用不同的技术来创建适合您自己用例的自定义解决方案。除此之外,如果您在项目中使用 JavaScript 实用程序库,则该库可能已经提供了一种内置方法来检查对象是否为空。
现代方法 (ES5 )
在本节中,我们将讨论您可以在支持 ES5 版本的现代浏览器中使用的不同方法。
1. Object.keys()
方法返回给定对象的枚举属性名称的数组。因此,我们可以通过计算此数组的长度来检查对象是否具有任何属性。
让我们来看下面的例子。
function isEmptyObject(obj) { return Object.keys(obj).length === 0; } console.log(isEmptyObject({})); // 输出:true var bar = {"foo": "1"}; console.log(Object.keys(bar).length); // 输出:1 console.log(isEmptyObject(bar)); // 输出:false
如上例所示,附加的 foo
属性,因此 isEmptyObject
函数将返回具有不同值的 isEmptyObject
函数。
请注意,isEmptyObject
将对 RegExp 对象返回 true
。
console.log(isEmptyObject(Date.now())); //输出:true console.log(isEmptyObject(new RegExp())); //输出:true
此外,请小心,因为使用未定义值调用此方法。它们会导致异常。稍后,我们将创建一个防弹解决方案,该解决方案不会在空输入时失败。
console.log(isEmptyObject(null)); //抛出 Uncaught TypeError: Cannot convert undefined or null to object
2. Object.getOwnPropertyNames()
方法返回给定对象的所有属性的数组。尽管它可能看起来与 Object.keys()
方法相同,但 Object.getOwnPropertyNames()
方法还会考虑不可枚举的属性,而 Object.keys()
会错过某些声明为不可枚举的属性。
让我们来看下面的例子。
function isEmptyObject(obj) { return Object.getOwnPropertyNames(obj).length === 0; } console.log(isEmptyObject({})); // 输出:true var bar = {"foo": "1"}; console.log(Object.getOwnPropertyNames(bar).length); // 输出:1 console.log(isEmptyObject(bar)); // 输出:false
如您所见,使用 Object.keys()
测试空值。
但是,边缘情况略有不同——Date
,但对于 null
或 JSON.stringify
将返回 false
。
使用 {}
检查给定对象是否为空。
让我们来看下面的例子。
function isEmptyObject(obj){ return JSON.stringify(obj) === '{}'; } console.log(isEmptyObject({})); // 输出:true var bar = {"foo":"1"}; console.log(JSON.stringify(bar)); // 输出:{"foo":"1"} console.log(isEmptyObject(bar)); // 输出:false
同样,边缘情况略有不同。“1651283138454” 用于 RegExp。因此使用 Object.getOwnPropertyNames
方法!
console.log(isEmptyObject(Date.now())); //输出:false console.log(isEmptyObject(new RegExp())); //输出:true
另一个变化是 false
,这可能不是您期望的。
console.log(isEmptyObject(null)); //输出:false
4. Object.entries()
方法返回一个数组的数组,每个元素都是一个对象属性的键值对数组。
让我们来看下面的例子来了解它的确切工作原理。
function isEmptyObject(obj) { return Object.entries(obj).length === 0; } console.log(isEmptyObject({})); // 输出:true var bar = {"foo":"1"}; console.log(Object.entries(bar)); // 输出:[['foo', '1']] console.log(Object.entries(bar).length); // 输出:1 console.log(isEmptyObject(bar)); // 输出:false
如您所见,Object.keys()
方法将对我们的 RegExp 对象边缘案例示例给出相同的结果。对于未定义的输入,它也会抛出异常。
console.log(isEmptyObject(Date.now())); //输出:true console.log(isEmptyObject(new RegExp())); //输出:true
防弹解决方案
上述简单解决方案的一个问题是它们对边缘情况给出了不一致的结果:特殊对象(如 Date)、未定义的值或基元(如整数)。这是一个简单但更可靠的解决方案。
function isEmptyObject(value) { const type = typeof value const isObject = value != null && type === 'object' return isObject && Object.keys(value).length === 0; }
此方法完全按照其名称执行:当且仅当输入值既是对象又是空对象时,它才返回 true
。它将与 null
和 undefined
值一起工作——返回 false
,因为它们不是对象。对于像 RegExp 这样的特殊对象,它将返回 true
,因为它们没有定义任何特殊键。它还将对空数组返回 true
,对非空数组返回 false
。
ES5 之前的方案
在本节中,我们将讨论一种即使在较旧的浏览器中也能工作的解决方案。在 JavaScript ES5 时代之前,经常使用这种方法,那时没有内置方法可用于检查对象是否为空。
让我们来看下面的例子。
function isEmptyObject(obj) { for (var property in obj) { if (obj.hasOwnProperty(property)) { return false; } } return true; } console.log(isEmptyObject({})); // 输出:true console.log(isEmptyObject({"foo":"1"})); // 输出:false
在上面的例子中,我们构建了一个自定义函数,您可以调用它来检查对象是否为空。它接受一个参数,您需要传递要测试的对象。在 FALSE 中,否则我们将使用不同的值返回 isEmptyObject
函数。如上例所示,我们使用不同的值调用它并使用 isEmptyObject
方法记录输出,这允许您检查对象是否为空。
让我们快速浏览下面的例子。
jQuery.isEmptyObject({}); // true jQuery.isEmptyObject({"foo":"1"}); // false
如您所见,使用 _.isEmpty()
非常简单。
结论
在本文中,我们讨论了在 JavaScript 中检查对象是否为空的几种不同方法。查看我们关于 JavaScript 编程的其他教程!
此帖子已更新,其中包含 Neema Muganga 的贡献。
以上是如何在JavaScript中检查对象是否为空的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

JavaScript是现代Web开发的基石,它的主要功能包括事件驱动编程、动态内容生成和异步编程。1)事件驱动编程允许网页根据用户操作动态变化。2)动态内容生成使得页面内容可以根据条件调整。3)异步编程确保用户界面不被阻塞。JavaScript广泛应用于网页交互、单页面应用和服务器端开发,极大地提升了用户体验和跨平台开发的灵活性。

Python和JavaScript开发者的薪资没有绝对的高低,具体取决于技能和行业需求。1.Python在数据科学和机器学习领域可能薪资更高。2.JavaScript在前端和全栈开发中需求大,薪资也可观。3.影响因素包括经验、地理位置、公司规模和特定技能。

实现视差滚动和元素动画效果的探讨本文将探讨如何实现类似资生堂官网(https://www.shiseido.co.jp/sb/wonderland/)中�...

JavaScript的最新趋势包括TypeScript的崛起、现代框架和库的流行以及WebAssembly的应用。未来前景涵盖更强大的类型系统、服务器端JavaScript的发展、人工智能和机器学习的扩展以及物联网和边缘计算的潜力。

学习JavaScript不难,但有挑战。1)理解基础概念如变量、数据类型、函数等。2)掌握异步编程,通过事件循环实现。3)使用DOM操作和Promise处理异步请求。4)避免常见错误,使用调试技巧。5)优化性能,遵循最佳实践。

如何在JavaScript中将具有相同ID的数组元素合并到一个对象中?在处理数据时,我们常常会遇到需要将具有相同ID�...

探索前端中类似VSCode的面板拖拽调整功能的实现在前端开发中,如何实现类似于VSCode...
