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

对象是编程中最常用的数据类型之一。对象是以键值对形式存储的相关数据的集合，例如：

let userDetails = {
  name: "John Doe",
  username: "jonnydoe",
  age: 14,
}

在处理对象时，你可能需要在执行函数之前检查对象是否为空。

在 JavaScript 中，有多种方法可以检查对象是否为空。在本文中，你将了解到检查对象是否为空的各种方法、可附加的选项以及原因。

注意： 当一个对象没有键值对时，它就被认为是空的。

如果你赶时间，下面是一个基本示例：

const myEmptyObj = {};
 
// 与新浏览器配合使用效果最佳
Object.keys(myEmptyObj).length === 0 && myEmptyObj.constructor === Object
 
// 适用于所有浏览器
_.isEmpty(myEmptyObj)

这两种方法都将返回 true。现在让我们来了解一下 JavaScript 中用于检查对象是否为空的这些方法和更多选项。

如何使用 Object.keys() 检查对象是否为空

Object.keys() 方法是 ECMAScript6（ES6）中引入的静态对象方法，所有现代浏览器都支持该方法。该方法返回一个包含对象键的数组，例如：

let userDetails = {
  name: "John Doe",
  username: "jonnydoe",
  age: 14
};
 
console.log(Object.keys(userDetails)); // ["name","username","age"]

这样，你就可以应用 .length 属性了。如果返回零（0），则对象为空。

let userDetails = {
  name: "John Doe",
  username: "jonnydoe",
  age: 14
};
 
let myEmptyObj = {};
 
console.log(Object.keys(userDetails).length); // 3
console.log(Object.keys(myEmptyObj).length); // 0

现在，你可以使用此方法通过 if 语句或创建一个函数来检查对象是否为空。

const isObjectEmpty = (objectName) => {
  return Object.keys(objectName).length === 0
}

这将返回 true 或 false。如果对象为空，则返回 true，否则返回 false。

let userDetails = {
  name: "John Doe",
  username: "jonnydoe",
  age: 14
};
 
let myEmptyObj = {};
 
const isObjectEmpty = (objectName) => {
  return Object.keys(objectName).length === 0
}
 
console.log(isObjectEmpty(userDetails)); // false
console.log(isObjectEmpty(myEmptyObj)); // true

**注意：**在检查对象是否为空或任何数据类型时，仅检查长度并不是最佳选择。最好是先确认数据类型是否正确。

为此，可以使用构造函数检查：

const isObjectEmpty = (objectName) => {
  return Object.keys(objectName).length === 0 && objectName.constructor === Object;
}

这样，你就可以进行更彻底的检查。

到目前为止，一切正常。但是你可能还想避免在变量是 undefined 或传递的值为 null 而不是 {} 时抛出 TypeError。为了解决这个问题，你可以增加一个额外的检查：

const isObjectEmpty = (objectName) => {
  return (
    objectName &&
    Object.keys(objectName).length === 0 &&
    objectName.constructor === Object
  );
};

在上面的代码中，增加了一个额外的检查。这意味着，如果不是空对象，它将返回 null 或 undefined，如下例所示：

let userDetails = {
  name: "John Doe",
  username: "jonnydoe",
  age: 14
};
 
let myEmptyObj = {};
let nullObj = null;
let undefinedObj;
 
const isObjectEmpty = (objectName) => {
  return (
    objectName &&
    Object.keys(objectName).length === 0 &&
    objectName.constructor === Object
  );
};
 
console.log(isObjectEmpty(userDetails)); // false
console.log(isObjectEmpty(myEmptyObj)); // true
console.log(isObjectEmpty(undefinedObj)); // undefined
console.log(isObjectEmpty(nullObj)); // null

**注：**这也适用于其他对象静态方法，这意味着你可以使用 Object.entries() 或 Object.values() 代替 Object.keys()。

如何使用 for…in 循环检查对象是否为空

你可以使用的另一种方法是 ES6 for…in 循环。你可以将此循环与 hasOwnProperty() 方法一起使用。

const isObjectEmpty = (objectName) => {
  for (let prop in objectName) {
    if (objectName.hasOwnProperty(prop)) {
      return false;
    }
  }
  return true;
};

上述方法将循环遍历对象的每个属性。如果找到一个迭代，则说明对象不是空的。此外，hasOwnProperty() 将返回一个布尔值，表明对象是否将指定属性作为其属性。

let userDetails = {
  name: "John Doe",
  username: "jonnydoe",
  age: 14
};
 
let myEmptyObj = {};
 
const isObjectEmpty = (objectName) => {
  for (let prop in objectName) {
    if (objectName.hasOwnProperty(prop)) {
      return false;
    }
  }
  return true;
};
 
console.log(isObjectEmpty(userDetails)); // false
console.log(isObjectEmpty(myEmptyObj)); // true

如何使用 JSON.stringify() 检查对象是否为空

你还可以使用 JSON.stingify() 方法，该方法用于将 JavaScript 值转换为 JSON 字符串。这意味着它会将对象值转换为对象的字符串，例如：

let userDetails = {
  name: "John Doe",
  username: "jonnydoe",
  age: 14
};
 
console.log(JSON.stringify(userDetails)); 
 
Output:
"{'name':'John Doe','username':'jonnydoe','age':14}"

这意味着当对象为空时，它将返回 "{}"。你可以利用它来检查对象是否为空。

const isObjectEmpty = (objectName) => {
  return JSON.stringify(objectName) === "{}";
};

如果对象为空，则返回 true，否则返回 false：

let userDetails = {
  name: "John Doe",
  username: "jonnydoe",
  age: 14
};
 
let myEmptyObj = {};
 
const isObjectEmpty = (objectName) => {
  return JSON.stringify(objectName) === "{}";
};
 
console.log(isObjectEmpty(userDetails)); // false
console.log(isObjectEmpty(myEmptyObj)); // true

如何使用 Lodash 检查对象是否为空

最后，我在这里介绍的某些方法可能适用于旧版本的浏览器，而另一些方法则可能不起作用。如果你想找到一种既适用于旧版本浏览器又适用于现代浏览器的解决方案，可以使用 Lodash。

Lodash 是一个现代 JavaScript 工具库，可以用非常基本的语法实现许多 JavaScript 功能。

例如，如果要检查对象是否为空，只需使用 “isEmpty” 方法即可。

_.isEmpty(objectName);

在项目中安装 Lodash 非常简单。你只需使用此命令即可：

$ npm install lodash

现在，你可以初始化下划线方法来使用该方法。

const _ = require('lodash');
 
let userDetails = {
  name: "John Doe",
  username: "jonnydoe",
  age: 14
};
 
let myEmptyObj = {};
 
const isObjectEmpty = (objectName) => {
  return _.isEmpty(objectName);
};
 
console.log(isObjectEmpty(userDetails)); // false
console.log(isObjectEmpty(myEmptyObj)); // true