本文将快速介绍如何在 JavaScript 中检查对象是否为空。
在日常 JavaScript 开发中,您可能需要检查对象是否为空。如果您曾经做过这件事,您可能知道没有单一的直接解决方案。但是,您可以使用不同的技术来创建适合您自己用例的自定义解决方案。除此之外,如果您在项目中使用 JavaScript 实用程序库,则该库可能已经提供了一种内置方法来检查对象是否为空。
在本节中,我们将讨论您可以在支持 ES5 版本的现代浏览器中使用的不同方法。
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
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
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
。
在本节中,我们将讨论一种即使在较旧的浏览器中也能工作的解决方案。在 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中文网其他相关文章!