如何循环或枚举 JavaScript 对象？

小编典典

如何循环或枚举 JavaScript 对象？

javascript

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

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

现在我想遍历所有p元素（p1, p2, p3…）并获取它们的键和值。我怎样才能做到这一点？

如有必要，我可以修改 JavaScript 对象。我的最终目标是遍历一些键值对，如果可能的话，我想避免使用eval.

阅读 269

2022-01-18

小编典典

您可以使用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])
}

Run code snippet

Expand snippet

注意使用for-of而不是for-in，如果不使用，它将在命名属性上返回未定义，并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}`);
}

2022-01-18

小编典典

在 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

2022-01-18

如何循环或枚举 JavaScript 对象？

共2个答案