4种JavaScript中不同迭代对象的方法

英文 | https://javascript.plainenglish.io/javascript-basics-4-different-ways-to-iterate-over-an-object-a5d16335cef

翻译 | 杨小爱

在今天这篇文章里，我将介绍了一些迭代对象并获取键值对的方法。这些技巧可以被视为小石头，最终将帮助您渡过 JavaScript 面试的一些小河流。

我知道每个独立的小石头可能没有多大用处，但如果我们得到一千颗或者一万颗这样的小石头，他们就会有用，甚至非常有用。

如果您想要获取更多这样的小石头，请记得关注我😉。

现在，我们就一起开始今天的内容吧。

我们如何在 JavaScript 中迭代对象并获得键值对？

在今天的内容，我将介绍4种不同的方法，可用于在 JavaScript 中迭代任何对象。

01、Object.values()

此方法从对象的值返回一个数组。它的工作顺序与对象的值相同。

const obj1 = {
    test1: 'atit',
    test2: 53,
    test3: false,
};
console.log(Object.values(obj1));
// expected output: Array ["atit", 53, false]

02、Object.keys()

此方法返回对象键名的数组。

const obj1 = {
    test1: 'atit',
    test2: 53,
    test3: false,
};
console.log(Object.keys(obj1));
// expected output: Array ["test1", "test2", "test3"]

03、Object.entries()

此方法返回对象的 [key, value] 对的数组。

const obj1 = {
    test1: 'atit',
    test2: 53,
    test3: false,
};
for (let [key, value] of Object.entries(obj1)) {
    console.log(key, value);
}
//test1 atit
//test2 53
//test3 false

我们还可以使用 hasOwnProperty 来检查对象中是否存在键。

for (let key in obj1) {
    if (obj1.hasOwnProperty(key)) {
        console.log(key, obj1[key]);
    }
}
//test1 atit
//test2 53
//test3 false

04、Object.fromEntries()

此方法将键值对列表转换为对象。

const test = new Map([
  ['atit', '51'],
  ['patel', 52]
]);
const obj1 = Object.fromEntries(test);
console.log(obj1);
// expected output: Object { atit: 51, patel: 52 }

学习更多技能

请点击下方公众号