如何循环或枚举 JavaScript 对象？

Question

我有一个 JavaScript 对象，如下所示：

var p = {
    "p1": "value1",
    "p2": "value2",
    "p3": "value3"
};

如何遍历 p 的所有元素（ p1 、 p2 、 p3 …）并获取它们的键和值？

原文由 Tanmoy 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可以使用其他人所示的 for-in 循环。但是，您还必须确保您获得的密钥是对象的实际属性，而不是来自原型。

这是片段：

 var p = {
 "p1": "value1",
 "p2": "value2",
 "p3": "value3"
 };

 for (var key in p) {
 if (p.hasOwnProperty(key)) {
 console.log(key + " -> " + p[key]);
 }
 }

使用 Object.keys() 替代方案：

 var p = {
 0: "value1",
 "b": "value2",
 key: "value3"
 };

 for (var key of Object.keys(p)) {
 console.log(key + " -> " + p[key])
 }

请注意使用 for-of 而不是 for-in ，如果不使用它将在命名属性上返回 undefined ，并且 Object.keys() 确保仅使用对象自己的属性而不使用整个原型链属性

使用新的 Object.entries() 方法：

注意： Internet Explorer 本身不支持此方法。您可以考虑为旧版浏览器使用 Polyfill。

 const p = {
 "p1": "value1",
 "p2": "value2",
 "p3": "value3"
 };

 for (let [key, value] of Object.entries(p)) {
 console.log(`${key}: ${value}`);
 }

原文由 levik 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

在 ECMAScript 5 下，您可以组合 Object.keys() 和 Array.prototype.forEach() ：

 var obj = { first: "John", last: "Doe" };

Object.keys(obj).forEach(function(key) {
    console.log(key, obj[key]);
});

ECMAScript 6 添加了 for...of ：

 for (const key of Object.keys(obj)) {
    console.log(key, obj[key]);
}

ECMAScript 8 添加了 Object.entries() 这避免了必须在原始对象中查找每个值：

 Object.entries(obj).forEach(
    ([key, value]) => console.log(key, value)
);

您可以组合 for...of 、解构和 Object.entries ：

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

Object.keys() 和 Object.entries() 以与 for...in 循环相同的顺序迭代属性， _但忽略原型链_。只有对象自己的可枚举属性被迭代。

原文由 Axel Rauschmayer 发布，翻译遵循 CC BY-SA 4.0 许可协议