js怎么获取json的key值

JavaScript 如何获取 JSON 对象的 key 值？全面指南

在 JavaScript 开发中，JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，常用于前后端数据传输，处理 JSON 数据时，经常需要获取其对象的 key（键）值，本文将详细介绍多种获取 JSON 对象 key 值的方法，包括基础语法、遍历技巧、进阶场景及注意事项，助你全面这一核心技能。

JSON 对象与 key 值的基础概念

首先明确：JSON 对象本质上是 JavaScript 对象的一种特殊格式，其 key 必须是字符串（可加引号，JSON 标准中推荐加双引号），value 可以是字符串、数字、布尔值、数组、对象或 null。

{
  "name": "Alice",
  "age": 25,
  "isStudent": false,
  "courses": ["Math", "English"],
  "address": {
    "city": "New York",
    "zip": "10001"
  }
}

在 JavaScript 中，我们可以直接将其赋值给一个变量，操作方式与普通对象完全一致：

const jsonData = {
  "name": "Alice",
  "age": 25,
  "isStudent": false,
  "courses": ["Math", "English"],
  "address": {
    "city": "New York",
    "zip": "10001"
  }
};

获取 JSON 对象 key 值的常用方法

使用 Object.keys() 方法（推荐）

Object.keys() 是 ES5 引入的静态方法，返回一个包含对象自身可枚举 key的数组（顺序为枚举顺序，现代 JavaScript 引擎中通常为定义顺序），这是最直接、最常用的获取 key 值的方式。

语法：

Object.keys(obj)

示例：

const keys = Object.keys(jsonData);
console.log(keys); // 输出: ["name", "age", "isStudent", "courses", "address"]

特点：

• 仅返回对象自身的可枚举 key（不包括原型链上的 key）；
• 返回数组可直接用于遍历（如 forEach、map 等）。

使用 for...in 循环遍历

for...in 循环用于遍历对象自身及原型链上所有可枚举的 key，如果只需要对象自身的 key，需配合 Object.prototype.hasOwnProperty() 方法过滤。

语法：

for (const key in obj) {
  if (Object.prototype.hasOwnProperty.call(obj, key)) {
    // 处理 key
  }
}

示例：

for (const key in jsonData) {
  if (Object.prototype.hasOwnProperty.call(jsonData, key)) {
    console.log(key); // 依次输出: "name", "age", "isStudent", "courses", "address"
  }
}

特点：

• 会遍历原型链上的 key，需手动过滤；
• 适用于需要同时处理 key 和 value 的场景。

使用 Object.getOwnPropertyNames() 方法

Object.getOwnPropertyNames() 返回一个包含对象自身所有 key（包括不可枚举的 key）的数组，与 Object.keys() 的区别在于，它会包含 enumerable: false 的 key（如通过 Object.defineProperty 定义的非枚举属性）。

语法：

Object.getOwnPropertyNames(obj)

示例：

// 定义一个非枚举属性
Object.defineProperty(jsonData, "internalId", {
  value: "12345",
  enumerable: false
});
const allKeys = Object.getOwnPropertyNames(jsonData);
console.log(allKeys); // 输出: ["name", "age", "isStudent", "courses", "address", "internalId"]

特点：

• 包含不可枚举的 key；
• 适用于需要获取对象所有属性（包括非枚举属性）的场景。

使用 Reflect.ownKeys() 方法（ES6）

Reflect.ownKeys() 是 ES6 新增的方法，返回一个包含对象自身所有 key（包括字符串 key 和 Symbol key，无论是否可枚举）的数组，这是唯一能同时获取字符串 key 和 Symbol key 的方法。

语法：

Reflect.ownKeys(obj)

示例：

// 添加一个 Symbol key
const symbolKey = Symbol("private");
jsonData[symbolKey] = "secret";
const allOwnKeys = Reflect.ownKeys(jsonData);
console.log(allOwnKeys); // 输出: ["name", "age", "isStudent", "courses", "address", "internalId", Symbol(private)]

特点：

• 包含字符串 key 和 Symbol key；
• 包含可枚举和不可枚举的 key；
• 适用于需要全面获取对象自身所有 key 的场景。

嵌套 JSON 对象的 key 值获取

JSON 对象是嵌套的（如上述 jsonData.address），要获取深层 key，需结合递归或路径遍历。

递归获取所有嵌套 key

通过递归遍历对象,将所有层级的 key 收集到一个数组中（可拼接路径）。

示例：

function getAllNestedKeys(obj, parentKey = "", result = []) {
  for (const key in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, key)) {
      const fullKey = parentKey ? `${parentKey}.${key}` : key;
      result.push(fullKey);
      if (typeof obj[key] === "object" && obj[key] !== null) {
        getAllNestedKeys(obj[key], fullKey, result);
      }
    }
  }
  return result;
}
const allNestedKeys = getAllNestedKeys(jsonData);
console.log(allNestedKeys);
// 输出: ["name", "age", "isStudent", "courses", "address.city", "address.zip", "internalId", Symbol(private)]

获取指定路径的 key

如果已知嵌套路径（如 "address.city"），可通过字符串分割或 reduce 方法逐层获取。

示例：

function getKeyByPath(obj, path) {
  return path.split(".").reduce((current, key) => current?.[key], obj);
}
const city = getKeyByPath(jsonData, "address.city");
console.log(city); // 输出: "New York"

处理动态 JSON 数据的注意事项

在实际开发中,JSON 数据可能是动态获取的（如从 API 返回），此时需注意以下几点：

确保 JSON 数据格式正确

如果数据是字符串格式（如 API 返回的 JSON.stringify 结果），需先用 JSON.parse() 解析为对象：

const jsonString = '{"name": "Bob", "age": 30}';
const jsonObj = JSON.parse(jsonString);
console.log(Object.keys(jsonObj)); // 输出: ["name", "age"]

处理可能的 null 或非对象值

如果动态数据可能为 null 或非对象类型，需先校验类型：

function getKeysSafely(data) {
  if (typeof data !== "object" || data === null) {
    return [];
  }
  return Object.keys(data);
}
console.log(getKeysSafely(null)); // 输出: []
console.log(getKeysSafely("invalid")); // 输出: []
console.log(getKeysSafely(jsonData)); // 输出: ["name", "age", ...]

处理 Symbol key

JSON 数据可能包含 Symbol key（需注意标准 JSON 不支持 Symbol，但 JavaScript 对象可以），需使用 Reflect.ownKeys() 获取完整 key 列表。

如何选择合适的方法？

实战案例：获取 API 返回 JSON 的所有 key

假设从 API 获取用户数据，需打印所有可用的 key：

// 模拟 API 返回的 JSON 字符串
const apiResponse = `{
  "id": "u001",
  "username": "john_doe",
  "profile": {