遍历js中对象的属性和值的实例

遍历JS对象的属性和值，通常采用两种方式：for...in循环和Object.keys()方法。

for...in循环

for循环可以遍历对象中所有可枚举的属性，并且对每一项执行指定的操作。

const obj = {
  name: "Tom",
  age: 18,
  gender: "male"
};

for (let key in obj) {
  console.log(`${key}: ${obj[key]}`);
}

输出：

name: Tom
age: 18
gender: male

在这个例子中，我们首先创建了一个包含几个属性的对象。接着，我们使用for循环遍历对象obj的所有属性，并使用模板字面量语法将属性名和属性值输出到控制台。

需要注意的是，for循环不仅可以遍历对象的自有属性，也可以遍历原型链中可枚举的属性。因此，在使用for循环时需要注意区分对象的自有属性和继承属性。

Object.keys()方法

Object.keys()方法可以返回一个由对象的所有自有属性名称组成的数组，然后我们可以遍历这个数组来获取对应的属性值。

const obj = {
  name: "Tom",
  age: 18,
  gender: "male"
};

const keys = Object.keys(obj);

for (let i = 0; i < keys.length; i++) {
  const key = keys[i];
  console.log(`${key}: ${obj[key]}`);
}

输出：

name: Tom
age: 18
gender: male

首先，我们使用Object.keys()方法获取对象自有属性的名称数组。然后我们可以使用for循环遍历这个数组，并使用数组索引获取属性名和属性值，最终输出到控制台。

需要注意的是，Object.keys()只能返回自有属性的名称列表，而不包含继承属性。

以上就是遍历JS对象属性和值的两种方式及其实例示范了。