js中json如何转为

JS中JSON数据转换为其他格式的完整指南

在JavaScript开发中,JSON（JavaScript Object Notation）作为一种轻量级的数据交换格式，广泛应用于前后端数据交互、配置文件存储等场景，实际开发中我们常需将JSON数据转换为其他格式（如字符串、对象、数组等）或从其他格式转换为JSON，本文将详细讲解JS中JSON的核心转换方法及常见场景应用。

JSON转字符串：JSON.stringify()

JSON本质上是JS对象的字符串表示形式,但有时需将JSON对象转换为字符串以便传输或存储，此时可使用JSON.stringify()方法。

语法：

JSON.stringify(value[, replacer[, space]])

• value：要转换的JSON对象或数组。
• replacer（可选）：函数或数组，用于控制哪些属性被转换。
• space（可选）：缩进空格数，用于格式化输出（便于调试）。

示例：

const jsonData = { name: "张三", age: 25, hobbies: ["reading", "coding"] };
// 1. 基本转换为字符串
const jsonString = JSON.stringify(jsonData);
console.log(jsonString); 
// 输出: '{"name":"张三","age":25,"hobbies":["reading","coding"]}'
// 2. 带缩进格式化（便于阅读）
const formattedString = JSON.stringify(jsonData, null, 2);
console.log(formattedString);
/* 输出:
{
  "name": "张三",
  "age": 25,
  "hobbies": ["reading", "coding"]
}
*/
// 3. 使用reacer过滤属性
const filteredString = JSON.stringify(jsonData, (key, value) => {
  if (key === "age") return undefined; // 过滤掉age属性
  return value;
});
console.log(filteredString); 
// 输出: '{"name":"张三","hobbies":["reading","coding"]}'

字符串转JSON：JSON.parse()

从后端或API获取的数据通常是JSON字符串,需通过JSON.parse()将其转换为JS对象或数组，才能操作其属性。

语法：

JSON.parse(text[, reviver])

• text：要解析的JSON字符串。
• reviver（可选）：函数，用于转换解析后的值（如日期字符串转为Date对象）。

示例：

const jsonString = '{"name": "李四", "age": 30, "isStudent": false}';
// 1. 基本解析为对象
const parsedObj = JSON.parse(jsonString);
console.log(parsedObj.name); // 输出: 李四
console.log(parsedObj.isStudent); // 输出: false
// 2. 解析JSON数组
const jsonArrayString = '[1, 2, "three", {"key": "value"}]';
const parsedArray = JSON.parse(jsonArrayString);
console.log(parsedArray[3].key); // 输出: value
// 3. 使用reviver处理日期（需自定义逻辑）
const dateJsonString = '{"event": "会议", "time": "2024-01-01T10:00:00Z"}';
const parsedWithDate = JSON.parse(dateJsonString, (key, value) => {
  if (key === "time") return new Date(value); // 将时间字符串转为Date对象
  return value;
});
console.log(parsedWithDate.time instanceof Date); // 输出: true

JSON与其他格式的特殊转换场景

除了基础的字符串与对象互转,实际开发中还可能遇到JSON与数组、Map、Set等结构的转换需求。

JSON对象转数组

若JSON对象的值是数组,可直接通过Object.values()或Object.keys()提取；若需嵌套转换，需递归处理。

const jsonData = { a: 1, b: [2, 3], c: { d: 4 } };
// 提取值组成数组
const valuesArray = Object.values(jsonData);
console.log(valuesArray); // 输出: [1, [2, 3], {d: 4}]
// 递归展平嵌套数组（示例）
function flattenJSONToArray(obj) {
  return Object.values(obj).reduce((acc, val) => {
    return Array.isArray(val) 
      ? acc.concat(flattenJSONToArray(val)) 
      : acc.concat(val);
  }, []);
}
console.log(flattenJSONToArray(jsonData)); // 输出: [1, 2, 3, 4]

JSON转Map/Set

通过Object.entries()将JSON对象转为键值对数组，再构造Map；Set可通过数组构造。

const jsonData = { x: 10, y: 20 };
// JSON转Map
const mapData = new Map(Object.entries(jsonData));
console.log(mapData.get("x")); // 输出: 10
// JSON数组转Set
const jsonArray = [1, 2, 3, 2, 1];
const setData = new Set(jsonArray);
console.log(setData); // 输出: Set(3) {1, 2, 3}

处理特殊数据类型（如Date、undefined）

JSON.stringify()会忽略undefined、函数、Symbol类型，且Date对象会被转为字符串，若需保留特殊类型，需手动处理。

const dataWithSpecial = { name: "王五", birth: new Date(), secret: undefined };
// 直接转换会丢失undefined和Date对象信息
console.log(JSON.stringify(dataWithSpecial)); 
// 输出: '{"name":"王五","birth":"2024-05-20T..."}'（日期转字符串）
// 自定义转换：保留Date对象和过滤undefined
function customStringify(obj) {
  return JSON.stringify(obj, (key, value) => {
    if (value instanceof Date) return { $date: value.toISOString() };
    if (value === undefined) return undefined; // 显式保留undefined（最终会被忽略）
    return value;
  });
}
console.log(customStringify(dataWithSpecial)); 
// 输出: '{"name":"王五","birth":{"$date":"2024-05-20T..."}}'

常见错误与注意事项

1. 语法错误：JSON.parse()要求字符串必须是严格的JSON格式（如属性名必须用双引号、不能用单引号）。

   // 错误示例：属性名用单引号
   const invalidStr = "{'name': '赵六'}";
   JSON.parse(invalidStr); // 抛出SyntaxError

2. 循环引用：若JSON对象存在循环引用（如obj.self = obj），JSON.stringify()会抛出错误。

   const cyclicObj = {};
   cyclicObj.self = cyclicObj;
   JSON.stringify(cyclicObj); // 抛出TypeError: Converting circular structure to JSON

3. 数据类型丢失：函数、Symbol、undefined会被JSON.stringify()忽略，Date对象转为字符串，需提前处理。

在JS中,JSON的转换是数据处理的核心能力：

• JSON转字符串：用JSON.stringify()，支持格式化和属性过滤；
• 字符串转JSON：用JSON.parse()，支持自定义解析逻辑；
• 特殊格式转换：通过Object.entries()、Map、Set等实现与复杂数据结构的互转；
• 注意事项：严格遵循JSON语法，避免循环引用，处理特殊数据类型时需自定义逻辑。

这些方法,能高效应对前后端数据交互、本地存储、配置解析等常见开发场景。