js如何遍历json的键和值

Hey小伙伴们！👋 今天我们来聊聊一个超级实用的话题——如何在JavaScript中遍历JSON的键和值，如果你经常和数据打交道，或者需要处理API返回的数据，那你绝对不能错过这个技能哦！🚀

让我们从一个简单的JSON对象开始，假设我们有这样一个JSON对象：

{
  "name": "Alice",
  "age": 25,
  "isStudent": false
}

这个对象包含了三个键值对：name、age和isStudent，在JavaScript中，我们可以使用多种方法来遍历这个对象的键和值，下面，我会介绍几种常用的方法，让你轻松这些技巧！

方法一：使用`for...in`循环

for...in循环是一种基本的遍历对象属性的方法，它允许我们迭代对象的每个可枚举属性，来看一个例子：

let obj = {
  "name": "Alice",
  "age": 25,
  "isStudent": false
};
for (let key in obj) {
  if (obj.hasOwnProperty(key)) { // 确保属性是对象自身的，而不是原型链上的
    console.log("Key:", key, "Value:", obj[key]);
  }
}

这段代码会输出：

Key: name Value: Alice
Key: age Value: 25
Key: isStudent Value: false

方法二：使用Object.keys()

Object.keys()方法返回一个包含对象自身所有可枚举属性名称的数组，我们可以用这个数组来遍历对象的键：

let obj = {
  "name": "Alice",
  "age": 25,
  "isStudent": false
};
Object.keys(obj).forEach(key => {
  console.log("Key:", key, "Value:", obj[key]);
});

这个方法和for...in循环的效果是一样的，但是它返回的是一个数组，这使得我们可以使用数组的方法，比如forEach来进行迭代。

方法三：使用Object.entries()

Object.entries()方法返回一个包含对象自身所有可枚举属性的键值对数组，这个数组的每个元素都是一个包含键和值的数组，来看一个例子：

let obj = {
  "name": "Alice",
  "age": 25,
  "isStudent": false
};
Object.entries(obj).forEach(([key, value]) => {
  console.log("Key:", key, "Value:", value);
});

这个方法直接返回了键和值的配对，非常适合需要同时处理键和值的场景。

方法四：使用Object.values()

如果你只关心对象的值，而不需要键，那么Object.values()方法会非常有用，它返回一个包含对象自身所有可枚举属性值的数组：

let obj = {
  "name": "Alice",
  "age": 25,
  "isStudent": false
};
Object.values(obj).forEach(value => {
  console.log("Value:", value);
});

这段代码会输出：

Value: Alice
Value: 25
Value: false

就是在JavaScript中遍历JSON对象键和值的几种常用方法，每种方法都有其适用的场景，你可以根据实际需要选择合适的方法，无论是处理API返回的数据，还是操作本地存储的数据，这些技巧都能帮你更高效地完成任务。

希望这篇分享对你有帮助！如果你有任何疑问或者想要了解更多，记得在评论区告诉我哦！我们下次再见！👩‍💻👋