一、for…in 循环
for (let key in object) {
console.log(key, object[key]);
}
for…in 循环是一种循环对象属性的方法。它会遍历对象的所有可枚举的属性，包括它的原型中的属性。在每次循环中，变量 key 会被赋值为当前属性的键名，而变量 object[key] 则被赋值为当前属性的值。
需要注意的是，用 for…in 循环遍历对象时，遍历对象的属性顺序是不确定的。在实际开发中，我们使用它主要是为了遍历对象的属性，而不必考虑它的顺序。
下面是一个 for…in 循环的示例：
let person = {name: "Tom", age: 21, gender: "male"};
for (let key in person) {
console.log(key, person[key]);
}
// Output:
// name Tom
// age 21
// gender male
二、Object.keys() 方法
let keys = Object.keys(object);
for (let i = 0; i < keys.length; i++) {
console.log(keys[i], object[keys[i]]);
}
Object.keys() 方法返回一个给定对象自身可枚举属性名称数组。使用它可以遍历对象的属性，但与 for…in 循环不同，它只考虑对象的自身属性，而不会遍历它的原型链。
我们可以使用 Object.keys() 方法获取对象的键名数组，然后使用数组的遍历方法，如 for 循环或 forEach() 方法来遍历对象的属性。
下面是一个 Object.keys() 方法的示例：
let person = {name: "Tom", age: 21, gender: "male"};
let keys = Object.keys(person);
for (let i = 0; i < keys.length; i++) {
console.log(keys[i], person[keys[i]]);
}
// Output:
// name Tom
// age 21
// gender male
三、Object.values() 方法
let values = Object.values(object);
for (let i = 0; i < values.length; i++) {
console.log(values[i]);
}
使用 Object.values() 方法可以获取一个给定对象所有可枚举属性的值的数组。同样地，它只考虑对象自身的属性，而不会遍历它的原型链。
我们可以使用 Object.values() 方法获取对象的值数组，然后使用数组的遍历方法，如 for 循环或 forEach() 方法来遍历对象的属性值。
下面是一个 Object.values() 方法的示例：
let person = {name: "Tom", age: 21, gender: "male"};
let values = Object.values(person);
for (let i = 0; i < values.length; i++) {
console.log(values[i]);
}
// Output:
// Tom
// 21
// male
四、Object.entries() 方法
let entries = Object.entries(object);
for (let i = 0; i < entries.length; i++) {
console.log(entries[i][0], entries[i][1]);
}
Object.entries() 方法返回一个给定对象自身可枚举属性的 [key, value] 数组。同样地，它只考虑对象的自身属性，而不会遍历它的原型链。
我们可以使用 Object.entries() 方法获取对象的键值对数组，然后使用数组的遍历方法，如 for 循环或 forEach() 方法来遍历对象的属性键值对。
下面是一个 Object.entries() 方法的示例：
let person = {name: "Tom", age: 21, gender: "male"};
let entries = Object.entries(person);
for (let i = 0; i < entries.length; i++) {
console.log(entries[i][0], entries[i][1]);
}
// Output:
// name Tom
// age 21
// gender male
总结
上述四种方法都可以用来遍历对象的属性。在实际开发中，我们需要根据实际需求来选择相应的方法。
如果需要遍历对象的所有属性，包括原型中的属性，则使用 for…in 循环。如果只需要遍历对象自身的属性，则使用 Object.keys()、Object.values() 或 Object.entries() 方法。
为了更好地理解各种方法的区别，请看下面的示例:
let person = {name: "Tom", age: 21, gender: "male"};
Object.defineProperty(person, 'job', {
value: 'developer',
enumerable: false
});
for (let key in person) {
console.log(key, person[key]);
}
// Output:
// name Tom
// age 21
// gender male
let keys = Object.keys(person);
for (let i = 0; i < keys.length; i++) {
console.log(keys[i], person[keys[i]]);
}
// Output:
// name Tom
// age 21
// gender male
let values = Object.values(person);
for (let i = 0; i < values.length; i++) {
console.log(values[i]);
}
// Output:
// Tom
// 21
// male
let entries = Object.entries(person);
for (let i = 0; i < entries.length; i++) {
console.log(entries[i][0], entries[i][1]);
}
// Output:
// name Tom
// age 21
// gender male
上面的例子中，我们给 person 对象添加了一个不可枚举的属性 job。在使用 for…in 循环遍历对象时，它会忽略该属性。而在使用 Object.keys()、Object.values() 或 Object.entries() 方法遍历对象时，这个属性不会被包含在里面。
原创文章，作者：JOCWO，如若转载，请注明出处：https://www.506064.com/n/324862.html
微信扫一扫 
支付宝扫一扫 