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

如何在JavaScript中检查对象是否为空

Christopher Nolan
发布: 2025-03-15 09:11:08
原创
699 人浏览过

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
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板