搜索
首页web前端js教程如何在JavaScript中检查对象是否为空

How to Check if an Object Is Empty in 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,但对于 nullJSON.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。它将与 nullundefined 值一起工作——返回 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中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
JavaScript应用程序:从前端到后端JavaScript应用程序:从前端到后端May 04, 2025 am 12:12 AM

JavaScript可用于前端和后端开发。前端通过DOM操作增强用户体验,后端通过Node.js处理服务器任务。1.前端示例:改变网页文本内容。2.后端示例:创建Node.js服务器。

Python vs. JavaScript:您应该学到哪种语言?Python vs. JavaScript:您应该学到哪种语言?May 03, 2025 am 12:10 AM

选择Python还是JavaScript应基于职业发展、学习曲线和生态系统:1)职业发展:Python适合数据科学和后端开发,JavaScript适合前端和全栈开发。2)学习曲线:Python语法简洁,适合初学者;JavaScript语法灵活。3)生态系统:Python有丰富的科学计算库,JavaScript有强大的前端框架。

JavaScript框架:为现代网络开发提供动力JavaScript框架:为现代网络开发提供动力May 02, 2025 am 12:04 AM

JavaScript框架的强大之处在于简化开发、提升用户体验和应用性能。选择框架时应考虑:1.项目规模和复杂度,2.团队经验,3.生态系统和社区支持。

JavaScript,C和浏览器之间的关系JavaScript,C和浏览器之间的关系May 01, 2025 am 12:06 AM

引言我知道你可能会觉得奇怪,JavaScript、C 和浏览器之间到底有什么关系?它们之间看似毫无关联,但实际上,它们在现代网络开发中扮演着非常重要的角色。今天我们就来深入探讨一下这三者之间的紧密联系。通过这篇文章,你将了解到JavaScript如何在浏览器中运行,C 在浏览器引擎中的作用,以及它们如何共同推动网页的渲染和交互。JavaScript与浏览器的关系我们都知道,JavaScript是前端开发的核心语言,它直接在浏览器中运行,让网页变得生动有趣。你是否曾经想过,为什么JavaScr

node.js流带打字稿node.js流带打字稿Apr 30, 2025 am 08:22 AM

Node.js擅长于高效I/O,这在很大程度上要归功于流。 流媒体汇总处理数据,避免内存过载 - 大型文件,网络任务和实时应用程序的理想。将流与打字稿的类型安全结合起来创建POWE

Python vs. JavaScript:性能和效率注意事项Python vs. JavaScript:性能和效率注意事项Apr 30, 2025 am 12:08 AM

Python和JavaScript在性能和效率方面的差异主要体现在:1)Python作为解释型语言,运行速度较慢,但开发效率高,适合快速原型开发;2)JavaScript在浏览器中受限于单线程,但在Node.js中可利用多线程和异步I/O提升性能,两者在实际项目中各有优势。

JavaScript的起源:探索其实施语言JavaScript的起源:探索其实施语言Apr 29, 2025 am 12:51 AM

JavaScript起源于1995年,由布兰登·艾克创造,实现语言为C语言。1.C语言为JavaScript提供了高性能和系统级编程能力。2.JavaScript的内存管理和性能优化依赖于C语言。3.C语言的跨平台特性帮助JavaScript在不同操作系统上高效运行。

幕后:什么语言能力JavaScript?幕后:什么语言能力JavaScript?Apr 28, 2025 am 12:01 AM

JavaScript在浏览器和Node.js环境中运行,依赖JavaScript引擎解析和执行代码。1)解析阶段生成抽象语法树(AST);2)编译阶段将AST转换为字节码或机器码;3)执行阶段执行编译后的代码。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

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

热工具

WebStorm Mac版

WebStorm Mac版

好用的JavaScript开发工具

MinGW - 适用于 Windows 的极简 GNU

MinGW - 适用于 Windows 的极简 GNU

这个项目正在迁移到osdn.net/projects/mingw的过程中,你可以继续在那里关注我们。MinGW:GNU编译器集合(GCC)的本地Windows移植版本,可自由分发的导入库和用于构建本地Windows应用程序的头文件;包括对MSVC运行时的扩展,以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

功能强大的PHP集成开发环境

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

EditPlus 中文破解版

EditPlus 中文破解版

体积小,语法高亮,不支持代码提示功能