如何遍历一个普通的 JavaScript 对象?
英文 | https://javascript.plainenglish.io/how-to-loop-through-a-plain-javascript-object-e3d1a45c2319
翻译 | 杨小爱
JavaScript 对象是通过向它们添加属性来动态创建的。
因此,我们可能必须使用循环遍历其属性来获取值。
在本文中,我们将研究如何遍历纯 JavaScript 对象。
Object.keys
Object.keys 方法返回一个对象的所有非继承字符串属性键的数组。
要使用它,我们可以写:
我们使用 for-of 循环遍历 Object.keys 返回的键数组。
然后,我们可以通过将键传递到 obj 之后的方括号来访问该值。
所以我们看到:
登录。
Object.values
我们可以使用 Object.values 方法循环遍历对象的值。
例如,我们可以这样写:
Object.values 返回一个包含对象所有属性值的数组,因此,我们可以使用 for-of 循环来记录属性值。
所以,我们得到:
1
2
3
在控制台中。
Object.entries
此外,我们可以使用 Object.entries 方法返回一个包含键值对数组的数组。
为此,我们可以编写:
我们从 Object.entries 返回的每个数组条目中解构键和值。
然后,我们可以将它们记录在循环体中。
我们得到了与上一个示例相同的结果。
循环遍历嵌套对象
要循环遍历嵌套对象,我们可以创建一个函数,该函数调用自身在对象的每个级别循环遍历它们的属性。
为此,我们写:
我们创建了带有 obj 对象的 loopNestedObj 函数。
在函数内部,我们有与前一个示例相同的循环。
但是,我们有一个 if 块来检查值的数据类型,看看它是否是一个对象。
如果是,那么我们调用 loopNestedObj 来循环遍历它的内容。
需要表达式 typeof value === ‘object’ && value !== null 来检查 value 是否是一个对象,因为 typeof null 也是 'object' 。
因此,我们需要两个检查来检查对象。
结论
我们可以使用 for-of 循环和 JavaScript 提供的各种静态对象方法来遍历对象。