JavaScript Key in Object——如何在JS中判断一个对象是否有 Key

JavaScript 中的对象是非原始数据类型,它包含了无序的键值对集合。

js object

正如您在上图中看到的那样,key 就是属性,每个对象值都必须有一个 key。

与对象交互时,可能会出现需要您检查特定 key 是否存在的情况。重要的是要注意,如果您知道一个 key 存在,则自动意味着一个 value 也存在。这个 value 可以是任何东西——甚至是空的、null 或者 undefined。

在本文中,我们将学习在 JavaScript 中检查对象 key 是否存在的各种方法。

如果您赶时间,我们可以使用以下两种标准方法进行检查:

// Using in operator
'key' in object

// Using hasOwnProperty() method
object.hasOwnProperty('key')

JavaScript 中如何使用 in 运算符检查 Object 是否具有某个 key

您可以使用 JavaScript in 运算符来检查 Object 中是否存在指定的属性/键。它具有简单的语法,如果指定的属性/键存在于指定的对象或其原型链中,则返回 true。

使用 in 运算符时的语法是:

'key' in object

假设我们有一个包含用户详细信息的对象:

let user = {
  name: "John Doe",
  age: 40
};

我们可以使用 in 运算符检查 key 是否存在,如下所示:

'name' in user; // Returns true
'hobby' in user; // Returns false
'age' in user; // Returns true

注意:in 关键字前的值应该是 string 或 symbol 类型。

JavaScript 中如何使用 hasOwnProperty() 方法检查 Object 是否具有某个 key

您可以使用 JavaScript 的 hasOwnProperty() 方法来检查指定对象是否具有给定属性。

该方法与 in 运算符非常相似。它接受一个字符串,如果该键存在于对象中,则返回 true,否则返回 false。

使用 hasOwnProperty() 方法时的语法是:

object.hasOwnProperty('key')

假设我们有一个包含用户详细信息的对象:

let user = {
  name: "John Doe",
  age: 40
};

使用 hasOwnProperty 检查键是否存在,如下所示:

user.hasOwnProperty('name'); // Returns true
user.hasOwnProperty('hobby'); // Returns false
user.hasOwnProperty('age'); // Returns true

注意:传递给 hasOwnProperty() 方法的值应该是 string 或 symbol 类型。

由于我们现在知道这些方法,我们现在可以使用条件来检查和执行我们希望执行的任何操作:

if ("name" in user) {
  console.log("the key exists on the object");
}

// Or

if (user.hasOwnProperty("name")) {
  console.log("the key exists on the object");
}

总结

在本文中,我们学习了如何使用两种标准方法检查对象是否具有某个键。这两种方法的区别在于 Object.hasOwnProperty() 单独在对象中查找键,而 in 运算符在对象及其原型链((prototype chain))中查找键。

您还可以使用其他方法,但在某些时候它们可能会变得过于复杂并且不容易理解。在针对某些条件进行测试时,它们也可能会失败。

例如,我们可以使用可选链运算符(optional chain),如果指定的键不存在,它将返回未定义:

let user = {
  name: "John Doe",
  age: 40
};

console.log(user?.name); // Returns John Doe
console.log(user?.hobby); // Returns undefined
console.log(user?.age); // Returns 40

所以我们可以创建一个条件,当它不等于 undefined 时,这意味着 key 存在:

if (user?.hobby !== undefined) {
  console.log("The key exists on the object");
}

正如我们之前所说,这些方法在针对一些不常见的条件进行测试时会失败。例如,在特定键设置为“undefined”的情况下,如下所示,条件判断会失败:

let user = {
  name: "John Doe",
  age: undefined
};

console.log(user?.age); // Returns undefined

另一个例子是,当我们在使用 Object.keys() 方法的同时使用 some() 方法时,它可以工作,但会变得复杂。这是可行的,但并不容易理解:

let user = {
  name: "John Doe",
  age: undefined
};

const checkIfKeyExist = (objectName, keyName) => {
    let keyExist = Object.keys(objectName).some(key => key === keyName);
    return keyExist;
};

console.log(checkIfKeyExist(user, 'name')); // Returns true

在上面的代码中,我们将所有的 key 都退为一个数组,然后应用 some() 方法来测试数组中是否至少有一个元素通过了测试。如果通过,则返回 true,否则返回 false。

祝你编码愉快!



也可以看看