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

前端小工
112 阅读4分钟

在这篇文章中，我将告诉你如何在JavaScript中检查一个对象是否为空。

在你日常的JavaScript开发中，可能需要检查一个对象是否为空。如果你不得不这样做，你可能会知道，没有一个直接的解决方案。然而，你可以使用不同的技术来为你自己的用例创建一个自定义的解决方案。除此之外，如果你在你的项目中使用一个JavaScript工具库，它有可能已经提供了一个内置的方法来检查一个对象是否为空。

Pre-ES5的方法

在这一节中，我们将讨论一种即使在老式浏览器中也能工作的解决方案。在JavaScript ES5时代之前，这种方法经常被使用，因为那时还没有内置的方法来检查一个对象是否为空。

让我们来看看下面的例子。

function isEmptyObject(obj) {
    for (var property in obj) {
        if (obj.hasOwnProperty(property)) {
            return false;
        }
    }

    return true;
}

console.log(isEmptyObject({})); // output: true
console.log(isEmptyObject({"foo":"1"})); // output: false

在上面的例子中，我们建立了一个自定义函数，你可以调用它来检查一个对象是否为空。它只需要一个参数，你需要传递一个你想测试的对象。在isEmptyObject 函数中，我们尝试迭代对象的属性。如果该对象有任何属性，我们将返回FALSE ，否则我们将返回TRUE 。

你可以继续用不同的值来测试isEmptyObject 函数。如上面的例子所示，我们已经用不同的值调用了它，并且用console.log 函数记录了输出。

所以这就是你如何在不支持ES5版本的浏览器中检查一个对象是否为空。在下一节，我们将在现代浏览器的背景下讨论它。

ES5+方式

在本节中，我们将讨论在支持ES5版的现代浏览器中可以使用的不同方法。

1.Object.keys()

Object.keys() 方法返回一个给定对象的可枚举属性名称的数组。因此，我们可以用它通过计算这个数组的长度来检查一个对象是否有任何属性。

让我们看一下下面的例子。

function isEmptyObject(obj) {
    return Object.keys(obj).length === 0;
}

console.log(isEmptyObject({})); // output: true

var bar = {"foo": "1"};
console.log(Object.keys(bar).length); // output: 1
console.log(isEmptyObject(bar)); // output: false

正如你在上面的例子中所看到的，bar 对象有附属于它的foo 属性，因此bar.keys(obj).length 表达式将返回一个大于0的值。因此，在这种情况下，isEmptyObject 函数将返回FALSE 。

继续用不同的值测试isEmptyObject 函数。

2.Object.getOwnPropertyNames()

Object.getOwnPropertyNames() 方法返回一个给定对象的所有属性的数组。虽然它看起来与Object.keys() 方法相同，但还是有区别的。Object.getOwnPropertyNames() 方法也考虑了非枚举的属性，而Object.keys() 只考虑了可枚举的属性。大多数情况下，这些都是等价的，但是有一种风险，即Object.keys() 会错过某些被声明为不可枚举的属性。

让我们看一下下面的例子。

function isEmptyObject(obj) {
    return Object.getOwnPropertyNames(obj).length === 0;
}

console.log(isEmptyObject({})); // output: true

var bar = {"foo": "1"};
console.log(Object.getOwnPropertyNames(bar).length); // output: 1
console.log(isEmptyObject(bar)); // output: false

正如你所看到的，用Object.getOwnPropertyNames() 测试空性与用Object.keys() 的效果相似。

3.JSON.stringify

JSON.stringify 方法是用来将一个JavaScript对象转换为JSON字符串的。所以我们可以用它将一个对象转换为一个字符串，我们可以将结果与{} 进行比较，以检查给定的对象是否为空。

让我们来看看下面的例子。

function isEmptyObject(obj){
    return JSON.stringify(obj) === '{}';
}

console.log(isEmptyObject({})); // output: true

var bar = {"foo":"1"};
console.log(JSON.stringify(bar)); // output: {"foo":"1"}
console.log(isEmptyObject(bar)); // output: false

4.Object.entries()

Object.entries() 方法返回一个数组，每个元素都是一个对象的属性的键值对数组。

让我们通过下面的例子来了解它到底是如何工作的。

function isEmptyObject(obj) {
    return Object.entries(obj).length === 0;
}

console.log(isEmptyObject({})); // output: true

var bar = {"foo":"1"};
console.log(Object.entries(bar)); // output: [['foo', '1']]
console.log(Object.entries(bar).length); // output: 1
console.log(isEmptyObject(bar)); // output: false

正如你所看到的，Object.entries() 方法将一个对象转换为一个数组，我们可以计算该数组的长度，以检查有关对象是否为空。

继续下去，用不同的值测试isEmptyObject 函数。

jQuery的方法

如果你已经在你的项目中使用了jQuery库，那么你就很容易检查一个对象是否为空，因为jQuery库已经提供了isEmptyObject 方法，它允许你检查一个对象是否为空。

让我们快速浏览一下下面的例子。

jQuery.isEmptyObject({}); // true
jQuery.isEmptyObject({"foo":"1"}); // false

正如你所看到的，使用jQuery的isEmptyObject 方法是相当直接的。

同样的，Lodash和Underscore.js库也有_.isEmpty() 。

总结

在这篇文章中，我们讨论了一些不同的方法，你可以用它们来检查一个对象是否为空。

avatar
文章
阅读
粉丝