在 JavaScript 中迭代对象

摘要：在本教程中，您将学习在 JavaScript 中迭代对象的各种方法。

for...in 循环

for...in 循环允许您迭代 对象 的可枚举 属性。在每次迭代中，您可以获取对象键，并使用它访问属性值。例如

let person = {
    firstName: 'John',
    lastName: 'Doe',
    age: 25,
    ssn: '123-456-2356'
};

for (let key in person) {
    if (person.hasOwnProperty(key)) {
        console.log(`${key} : ${person[key]}`);
    }
}
Code language: JavaScript (javascript)

输出

firstName : John
lastName : Doe
age : 25
ssn : 123-456-2356

此 hasOwnProperty() 方法确保该属性属于 person 对象，而不是继承的属性。

请注意，for...in 会忽略由 Symbol 作为键的属性。

 Object.keys()

Object.keys() 接受一个对象并返回一个包含该对象属性的 数组。通过将 Object.keys() 与 forEach() 方法链接起来，您可以访问对象的键和值。请注意，Object.keys() 方法是在 ES6 中引入的。例如

let person = {
    firstName: 'John',
    lastName: 'Doe',
    age: 25,
    ssn: '123-456-2356'
};

Object.keys(person).forEach(key => {
    console.log(`${key}: ${person[key]}`);
});Code language: JavaScript (javascript)

输出

firstName: John
lastName: Doe
age: 25
ssn: 123-456-2356Code language: HTTP (http)

 Object.values()

Object.values() 接受一个对象作为参数，并返回一个包含该对象值的数组。Object.entries() 方法从 ES7 开始可用。

let person = {
    firstName: 'John',
    lastName: 'Doe',
    age: 25,
    ssn: '123-456-2356'
};

Object.values(person).forEach(value => {
    console.log(`${value}`);
});
Code language: JavaScript (javascript)

输出

John
Doe
25
123-456-2356

 Object.entries()

Object.entries() 接受一个对象，并返回一个包含该对象自身可枚举的字符串键属性 [key, value] 对的数组。

let person = {
    firstName: 'John',
    lastName: 'Doe',
    age: 25,
    ssn: '123-456-2356'
};

Object.entries(person).forEach(([key, value]) => {
    console.log(`${key}: ${value}`);
});
Code language: JavaScript (javascript)

输出

firstName: John
lastName: Doe
age: 25
ssn: 123-456-2356    
Code language: HTTP (http)

Object.getOwnPropertyNames()

Object.getOwnPropertyNames() 方法接受一个对象作为参数，并返回一个包含该对象键的数组，包括不可枚举的属性，但不包括使用 Symbol 的属性。

let person = {
    firstName: 'John',
    lastName: 'Doe',
    age: 25,
    ssn: '123-456-2356'
};

Object.getOwnPropertyNames(person).forEach(key =>
    console.log(`${key}: ${person[key]}`)
);
Code language: JavaScript (javascript)

输出

firstName: John
lastName: Doe
age: 25
ssn: 123-456-2356Code language: HTTP (http)

在本教程中，您学习了在 JavaScript 中迭代对象的各种方法。