迹忆客 专注技术分享

JavaScript 对象非常灵活，可用于创建键值对。 这些对象的工作方式类似于 Python 字典。

字典和对象之所以被广泛使用，是因为每个存储的值都有其唯一的键（类似于 JavaScript 数组），并且可以通过那些键访问那些值。 这允许在读取和存储数据时具有出色的灵活性。

本篇文章将介绍如何在 JavaScript 中迭代对象或字典来提取键值对。

使用 Object.entries() 在 JavaScript 中循环遍历字典

我们可以使用 Object.entries() 方法返回给定对象的 [key, value] 对字符串键可枚举属性的数组。

这类似于使用 for...in 循环进行迭代。 然而，这个循环枚举了原型链中的属性。

它返回的数组顺序与 for...in 循环返回的顺序相同。 JavaScript 中的可枚举属性意味着当使用 for...in 循环或 Object.keys() 方法迭代时属性是可见的。

默认情况下，由简单赋值或属性初始值设定项创建的所有属性都是可枚举的。

语法：

Object.entries(obj)

Object.entries 方法接受一个对象作为参数，一个必需的参数。

让我们以员工对象为例。 此对象包含基本的员工详细信息。

当你遍历一个员工对象时，它会打印出它所有的可枚举属性。

const object = {
    employeeName: "John Doe",
    employeeId: 27,
    salary: {
        "2018 - 19": "400000INR",
        "2019 - 20": "500000INR",
        "2020 - 21": "650000INR"
    },
}

Object.defineProperty(student, 'address', {
    value: "India",
    configurable: true,
    writable: false,
    enumerable: false,
});

for (const [key, value] of Object.entries(object)) {
    console.log(key, value);
}

我们在上面的例子中添加了新的 address 属性，但是它的可枚举类型被设置为 false。 由于 Object.entries() 方法仅遍历可枚举属性，因此不会打印地址属性。

尝试在任何浏览器中运行上面的示例。 您将看到以下结果。

输出：

"employeeName", "John Doe"
"employeeId", 27
"salary", {
  2018-19: "400000INR",
  2019-20: "500000INR",
  2020-21: "650000INR"
}