脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → JavaScript遍历JSON所有Key

JavaScript遍历JSON所有Key的常用方法总结

 更新时间：2026年05月14日 08:24:35   作者：detayun  
这篇文章主要为大家详细介绍了JavaScript遍历JSON所有Key的四种常用方法,并展示了递归遍历嵌套JSON的技巧和各方法的特点,有需要的小伙伴可以了解下

本文介绍了四种遍历JSON对象属性的方法：

  • for...in循环：最常用，但会遍历原型链属性
  • Object.keys()：推荐方法，返回对象自身可枚举属性
  • Object.entries()：同时获取键值对
  • Object.getOwnPropertyNames()：包含不可枚举属性

文内还展示了递归遍历嵌套JSON的技巧，并对比了各方法特点。推荐大家日常使用Object.keys()或Object.entries()，它们更安全且语义清晰。对于复杂嵌套结构，可采用递归方式深度遍历所有层级。

for…in 循环（最常用）

const json = {
  name: "张三",
  age: 25,
  city: "北京"
};

for (let key in json) {
  console.log(key);           // name, age, city
  console.log(json[key]);     // 张三, 25, 北京
}

Object.keys()（推荐 ✅）

Object.keys(json).forEach(key => {
  console.log(key, json[key]);
});

// 或
Object.keys(json).map(key => {
  console.log(key);
});

Object.entries()（同时获取 key 和 value）

for (let [key, value] of Object.entries(json)) {
  console.log(`${key}: ${value}`);
}

Object.getOwnPropertyNames()（包括不可枚举属性）

Object.getOwnPropertyNames(json).forEach(key => {
  console.log(key);
});

递归遍历嵌套 JSON

function traverseKeys(obj, prefix = '') {
  for (let key in obj) {
    const fullKey = prefix ? `${prefix}.${key}` : key;
    console.log(fullKey);
    
    if (typeof obj[key] === 'object' && obj[key] !== null) {
      traverseKeys(obj[key], fullKey);  // 递归
    }
  }
}

const nestedJson = {
  user: {
    name: "张三",
    address: {
      city: "北京",
      street: "长安街"
    }
  }
};

traverseKeys(nestedJson);
// 输出: user
//       user.name
//       user.address
//       user.address.city
//       user.address.street

方法对比

方法遍历原型链包含 Symbol推荐场景
for...in✅❌简单遍历
Object.keys()❌❌日常推荐
Object.entries()❌❌需要 key+value
getOwnPropertyNames()❌✅完整属性

推荐使用 Object.keys() 或 Object.entries()，更安全且语义清晰！

方法补充

在 JavaScript 中，遍历 JSON（即 JavaScript 对象）的所有 Key 有多种常用方法。下面按照推荐程度和使用场景介绍。

1. Object.keys() – 最常用

返回对象自身可枚举属性的 key 数组，不含原型链上的属性。

const obj = { name: 'Alice', age: 25, city: 'Beijing' };
Object.keys(obj).forEach(key => {
  console.log(key, obj[key]);
});
// 输出: name Alice, age 25, city Beijing

2. for...in – 遍历所有可枚举属性（含原型链）

for (let key in obj) {
  if (obj.hasOwnProperty(key)) { // 过滤掉原型链上的属性
    console.log(key, obj[key]);
  }
}

如果不加 hasOwnProperty 判断，会遍历到继承的属性（如 toString），通常需要避免。

3. Object.entries() – 同时获取键和值

Object.entries(obj).forEach(([key, value]) => {
  console.log(key, value);
});

4. Object.getOwnPropertyNames() – 包含不可枚举属性

const obj = Object.create({}, {
  visible: { value: 1, enumerable: true },
  hidden:  { value: 2, enumerable: false }
});
Object.getOwnPropertyNames(obj).forEach(key => console.log(key));
// 输出: visible, hidden （包含不可枚举的 hidden）

5. Reflect.ownKeys() – 包含 Symbol 类型键

const sym = Symbol('id');
const obj = { [sym]: 123, name: 'test' };
Reflect.ownKeys(obj).forEach(key => console.log(key, obj[key]));
// 输出: name test, Symbol(id) 123

6. 遍历嵌套 JSON 的所有 Key（递归）

如果 JSON 内部还嵌套了对象或数组，需要递归才能获取所有层级的键。

function getAllKeys(obj, prefix = '') {
  let keys = [];
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      const fullKey = prefix ? `${prefix}.${key}` : key;
      keys.push(fullKey);
      const val = obj[key];
      if (val && typeof val === 'object') {
        keys = keys.concat(getAllKeys(val, fullKey));
      }
    }
  }
  return keys;
}

const json = {
  user: { name: 'John', address: { city: 'NYC', zip: 10001 } },
  active: true
};
console.log(getAllKeys(json));
// 输出: ['user', 'user.name', 'user.address', 'user.address.city', 'user.address.zip', 'active']
方法自身可枚举自身不可枚举原型链Symbol
Object.keys()✔️❌❌❌
for...in✔️❌✔️（需过滤）❌
Object.getOwnPropertyNames()✔️✔️❌❌
Reflect.ownKeys()✔️✔️❌✔️

日常遍历普通 JSON 对象，Object.keys() 是最简单、最推荐的方法。 如果需要同时获取值，使用 Object.entries()。如果需要包含不可枚举或 Symbol 键，再考虑另外两种。

到此这篇关于JavaScript遍历JSON所有Key的常用方法总结的文章就介绍到这了,更多相关JavaScript遍历JSON所有Key内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

相关文章

最新评论