0

0

什么是json_javascript中如何解析和生成?

狼影

狼影

发布时间:2025-12-16 12:02:58

|

511人浏览过

|

来源于php中文网

原创

JSON是轻量级数据交换格式,键名须双引号、禁末尾逗号、不支持函数/undefined/Symbol等;用JSON.parse()解析字符串为JS值,JSON.stringify()将JS值转为JSON字符串。

什么是json_javascript中如何解析和生成?

JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,语法简洁、易读易写,也便于机器解析和生成。它不是 JavaScript 专属,但和 JS 对象字面量高度相似,因此在 JavaScript 中原生支持解析和生成。

JSON 和 JS 对象的区别

虽然长得像,但 JSON 是纯字符串格式,有严格规则:键名必须用双引号包裹,不能有单引号或不加引号;不允许末尾逗号;不能包含函数、undefined、Symbol、Date 实例、RegExp 等 JS 特有值;null 是合法的。

例如,这个是合法 JSON 字符串:

{"name": "张三", "age": 25, "isStudent": false}

而下面这些不是合法 JSON:

立即学习Java免费学习笔记(深入)”;

  • {'name': '张三'}(单引号 → 错误)
  • {name: "张三"}(键没引号 → 错误)
  • {age: 25,}(末尾逗号 → 错误)
  • {date: new Date()}(含对象实例 → 不可序列化为 JSON)

用 JSON.parse() 解析 JSON 字符串

把符合 JSON 格式的字符串转成 JS 对象或数组,用 JSON.parse()

家电小商城网站源码1.0
家电小商城网站源码1.0

家电公司网站源码是一个以米拓为核心进行开发的家电商城网站模板,程序采用metinfo5.3.9 UTF8进行编码,软件包含完整栏目与数据。安装方法:解压上传到空间,访问域名进行安装,安装好后,到后台-安全与效率-数据备份还原,恢复好数据后到设置-基本信息和外观-电脑把网站名称什么的改为自己的即可。默认后台账号:admin 密码:132456注意:如本地测试中127.0.0.1无法正常使用,请换成l

下载
  • 基本用法:JSON.parse('{"x":1,"y":2}') → 返回 {x: 1, y: 2}
  • 带错误处理:必须用 try/catch,因为非法 JSON 会直接抛错
  • 可选第二个参数 reviver 函数,用于在解析过程中转换值(比如把时间字符串转成 Date 对象)

示例:

try {
  const data = JSON.parse('{"time":"2024-06-01"}', (key, value) => {
    if (key === 'time') return new Date(value);
    return value;
  });
  // data.time 是 Date 实例
} catch (e) {
  console.error('解析失败:', e.message);
}

用 JSON.stringify() 生成 JSON 字符串

把 JS 值(对象、数组、字符串、数字、布尔、null)转成 JSON 字符串,用 JSON.stringify()

  • 基础用法:JSON.stringify({a: 1, b: [2,3]}){"a":1,"b":[2,3]}
  • 第二个参数可传 replacer:数组(指定要保留的键)或函数(自定义序列化逻辑)
  • 第三个参数可传空格数或字符串,用于美化输出(如缩进 2 个空格)
  • 注意:undefined、函数、Symbol 会被忽略;NaN 和 Infinity 转为 null;Date 实例调用 toJSON()(即 ISO 字符串)

示例:

const obj = {
  id: 1,
  name: "李四",
  createdAt: new Date(),
  meta: undefined,
  fn: () => {}
};
console.log(JSON.stringify(obj, null, 2));
// 输出(自动忽略 meta 和 fn,日期转为字符串)

常见坑与注意事项

实际开发中容易踩的点:

  • 后端返回的响应体是字符串,但忘了 JSON.parse() 就直接当对象用 → 报错 “xxx is not an object”
  • fetch 或 axios 默认不自动解析 JSON,需手动调用 .json()(这是 Promise 方法,内部已封装 parse)
  • 循环引用对象(比如 a.b = a)传给 stringify → 抛错 “Converting circular structure to JSON”
  • 想序列化 Map/Set/BigInt/自定义类实例?原生不支持,需自行实现 replacer 或用第三方库(如 flatted、serialize-javascript

基本上就这些。用好 JSON.parse 和 JSON.stringify,是前端日常处理接口数据最基础也最关键的技能之一。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
json数据格式
json数据格式

JSON是一种轻量级的数据交换格式。本专题为大家带来json数据格式相关文章,帮助大家解决问题。

420

2023.08.07

json是什么
json是什么

JSON是一种轻量级的数据交换格式,具有简洁、易读、跨平台和语言的特点,JSON数据是通过键值对的方式进行组织,其中键是字符串,值可以是字符串、数值、布尔值、数组、对象或者null,在Web开发、数据交换和配置文件等方面得到广泛应用。本专题为大家提供json相关的文章、下载、课程内容,供大家免费下载体验。

536

2023.08.23

jquery怎么操作json
jquery怎么操作json

操作的方法有:1、“$.parseJSON(jsonString)”2、“$.getJSON(url, data, success)”;3、“$.each(obj, callback)”;4、“$.ajax()”。更多jquery怎么操作json的详细内容,可以访问本专题下面的文章。

312

2023.10.13

go语言处理json数据方法
go语言处理json数据方法

本专题整合了go语言中处理json数据方法,阅读专题下面的文章了解更多详细内容。

77

2025.09.10

c语言中null和NULL的区别
c语言中null和NULL的区别

c语言中null和NULL的区别是:null是C语言中的一个宏定义,通常用来表示一个空指针,可以用于初始化指针变量,或者在条件语句中判断指针是否为空;NULL是C语言中的一个预定义常量,通常用来表示一个空值,用于表示一个空的指针、空的指针数组或者空的结构体指针。

237

2023.09.22

java中null的用法
java中null的用法

在Java中,null表示一个引用类型的变量不指向任何对象。可以将null赋值给任何引用类型的变量,包括类、接口、数组、字符串等。想了解更多null的相关内容,可以阅读本专题下面的文章。

458

2024.03.01

if什么意思
if什么意思

if的意思是“如果”的条件。它是一个用于引导条件语句的关键词,用于根据特定条件的真假情况来执行不同的代码块。本专题提供if什么意思的相关文章,供大家免费阅读。

780

2023.08.22

scripterror怎么解决
scripterror怎么解决

scripterror的解决办法有检查语法、文件路径、检查网络连接、浏览器兼容性、使用try-catch语句、使用开发者工具进行调试、更新浏览器和JavaScript库或寻求专业帮助等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

228

2023.10.18

C++ 设计模式与软件架构
C++ 设计模式与软件架构

本专题深入讲解 C++ 中的常见设计模式与架构优化,包括单例模式、工厂模式、观察者模式、策略模式、命令模式等,结合实际案例展示如何在 C++ 项目中应用这些模式提升代码可维护性与扩展性。通过案例分析,帮助开发者掌握 如何运用设计模式构建高质量的软件架构,提升系统的灵活性与可扩展性。

14

2026.01.30

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 4.4万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 2.6万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.1万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号