是不是还不知道怎么回答面试官JS如何检查对象是否为空
面试官:JS如何检查一个对象是否为空?
我:可以通过`json.stringify、Object.keys、循环、Object.values等方式。
本文将从下面三个方面带你了解其中的原理,从根本上给面试官讲明白其中的原理。
- JavaScript 中检查对象是否为空的不同方法
- ES6 检查对象是否为空的方法
- 检查对象是否为空、未定义或 null。
JavaScript 对象
在检查对象是否为空之前,让我们先看看 JavaScript 中的对象是什么。
在 JavaScript 中,对象只是键值对的集合。其中每个键或属性都是一个字符串,每个值可以是任何 JavaScript 数据类型,包括其他对象。
对象是JavaScript 中的非原始数据类型
之一,它们在 JavaScript 应用程序中广泛使用。下面是一个 JavaScript 对象示例:
// JavaScript person object
const person = {
firstName: "John",
lastName: "Doe",
age: 30,
address: {
street: "123 Main St",
city: "Anytown",
state: "CA",
zipCode: "12345"
}
};
在此示例中,人员是具有四个属性或键的对象。它们是名字、姓氏、年龄和地址。地址属性本身是一个嵌套对象,具有四个属性 street、city、state 和 zipCode。
JavaScript 通过 8 种不同的方式检查对象是否为空
如何检查对象是否为空?
我们可以通过检查某个对象的键或值长度来确定该对象是否为空。JavaScript 中有不同的方法来检查对象是否为空。在这篇文章中,让我们看看可用于检查对象是否为空的四种不同方法。
1.使用JSON.stringify()方法检查对象是否为空
JSON.stringify()
方法可以将对象转换为字符串,通过字符串判断对象是否为空:
const emptyObject = {};
if (JSON.stringify(emptyObject) === '{}') {
console.log('The object is empty');
}
2.使用Object.keys()方法检查对象是否为空
JavaScript Object.keys()
方法返回给定对象的属性名称的数组。如果对象的属性名称JavaScript数组长度
等于0,我们可以确认该对象是空的。
让我们看看如何使用 Object.keys() 检查 JavaScript 对象是否为空:
const emptyObject = {};
if (Object.keys(emptyObject).length === 0) {
console.log("The object is empty");
}
// Output: "The object is empty"
在上面的代码中,如果键长度为0,我们可以确认对象为空。否则,如果对象不为空,我们可以进行对象操作。
3. JavaScript 使用 for...in 循环检查是否为空对象
for…in 循环迭代对象的可枚举属性并返回每个属性名称。与其他方法相比,此方法需要更多行代码来检查对象是否为空。使用 for..in 循环方法作为检查对象是否为空的最后一个选项。
以下是检查对象为空的示例:
const emptyObject = {};
let isEmpty = true;
for (let key in emptyObject) {
isEmpty = false;
break;
}
if (isEmpty) {
console.log("The object is empty");
}
// Output: "The object is empty"
4. 使用Object.values()方法检查JavaScript对象是否为空
Object.values() 方法返回给定对象的属性值的数组。检查JavaScript 对象长度属性
以确定该对象是否为空。
const emptyObject = {};
if (Object.values(emptyObject).length === 0) {
console.log("The object is empty");
}
// Output: "The object is empty"
5. 如何使用 Object.entries() 方法检查空对象
const emptyObject = {};
if (Object.entries(emptyObject).length === 0) {
console.log("The object is empty");
}
// Output: "The object is empty"
ES6 检查对象是否为空
ES6 引入了三种新方法来获取对象的属性。让我们看看如何在 JavaScript 中使用检查对象是否为空。
6. JavaScript ES6使用Object.getOwnPropertyNames()方法检查空对象
Object.getOwnPropertyNames() 方法返回所有属性或键名称的数组。此方法还返回给定对象的不可枚举属性。
这是一个例子:
const emptyObject = {};
if (Object.getOwnPropertyNames(emptyObject).length === 0) {
console.log("The object is empty");
}
// Output: "The object is empty"
7. ES6 使用 Reflect.ownKeys() 方法检查对象是否为空
Reflect.ownKeys ()方法返回给定对象的属性名称和符号键的数组。
这是一个例子:
const emptyObject = {};
if (Reflect.ownKeys(emptyObject).length === 0) {
console.log("The object is empty");
}
// Output: "The object is empty"
8. 使用Object.getOwnPropertySymbols()方法
Object.getOwnPropertySymbols() 方法返回给定对象的符号键的数组。
这是一个例子:
const emptyObject = {};
if (Object.getOwnPropertySymbols(emptyObject).length === 0) {
console.log("The object is empty");
}
// Output: "The object is empty"
检查对象键值是否为空
假设我们有一个包含名字、姓氏和年龄的人员对象。以下是如何检查姓氏是否为空的示例:
let person = {
firstName: 'John',
lastName: '',
age: 30,
};
if (person && person.lastName.trim() === '')
console.log('Last name is empty');
else {
console.log('Last name is not empty');
}
// Output: "Last name is empty"
在上面的示例中,JavaScript trim()方法用于从姓氏键中删除空格字符。
检查对象是否为空、未定义或 null
JavaScript 中的空对象、未定义对象和 null 对象之间存在区别:
- 空对象没有属性。
- 未定义的对象未定义。
- 空对象是没有值的对象。
请参考以下代码来检查对象是否为空、未定义或 null:
const emptyObject = {};
if (!emptyObject) {
console.log("The object is null or undefined.");
} else if (Object.keys(emptyObject).length === 0) {
console.log("The object is empty.");
} else {
console.log("The object is not empty.");
}
// Output: "The object is empty."
在上面的代码中,我们首先使用逻辑非 (!) 运算符检查对象是否为 null 或未定义。如果它为空或未定义,我们会向控制台打印一条消息“该对象为空或未定义”。
当对象不为 null 或未定义时,我们使用 Object.keys() 方法检查对象是否为空。如果对象为空,我们会向控制台打印一条消息“对象为空”。
如果 JavaScript 对象不为空,我们会向控制台打印一条消息“该对象不为空”。
结论
检查对象是否为空、未定义或 null 在 JavaScript 编程中至关重要。我们在本文中探索了不同的方法来确定对象是否具有任何属性。这可以帮助您在尝试访问对象中实际上不存在的属性时避免运行时错误。
我们介绍的方法包括 Object.keys()、for…in 循环、Object.values()、Object.entries()、Object.getOwnPropertyNames()、Reflect.ownKeys() 和 Object.getOwnPropertySymbols()。
转载自:https://juejin.cn/post/7252200801589837883