js 遍历 json

// 示例 JSON 数据
const jsonData = {
    "name": "John",
    "age": 30,
    "city": "New York",
    "skills": ["JavaScript", "Python", "HTML", "CSS"]
};

// 方法 1: 使用 for...in 遍历对象的键
for (let key in jsonData) {
    if (jsonData.hasOwnProperty(key)) {
        console.log(`${key}: ${jsonData[key]}`);
    }
}

// 方法 2: 使用 Object.keys() 和 forEach 遍历对象的键
Object.keys(jsonData).forEach(function(key) {
    console.log(`${key}: ${jsonData[key]}`);
});

// 方法 3: 使用 Object.entries() 和 forEach 遍历对象的键值对
Object.entries(jsonData).forEach(([key, value]) => {
    console.log(`${key}: ${value}`);
});

// 方法 4: 如果是遍历数组类型的 JSON 数据
const jsonArray = [
    { "name": "Alice", "age": 25 },
    { "name": "Bob", "age": 35 },
    { "name": "Charlie", "age": 45 }
];

jsonArray.forEach(item => {
    console.log(`Name: ${item.name}, Age: ${item.age}`);
});

解释说明：

1. 方法 1: 使用 for...in 遍历对象的键

   • for...in 可以遍历对象的所有可枚举属性，包括继承的属性。为了确保只遍历自身的属性（而不是原型链上的属性），我们使用了 hasOwnProperty() 方法。

2. 方法 2: 使用 Object.keys() 和 forEach 遍历对象的键

   • Object.keys() 返回一个包含对象所有键的数组，然后我们可以使用 forEach 来遍历这些键，并访问对应的值。

3. 方法 3: 使用 Object.entries() 和 forEach 遍历对象的键值对

   • Object.entries() 返回一个包含对象所有键值对的数组，每个元素都是一个 [key, value] 的数组。这样可以直接同时获取键和值。

4. 方法 4: 遍历数组类型的 JSON 数据

   • 如果 JSON 数据是一个数组，可以使用 forEach 直接遍历数组中的每个对象，并访问对象的属性。