JSON 介绍及使用方法_json格式
一、JSON 简介
JSON(JavaScript Object Notation,JavaScript 对象表示法)是一种轻量级的数据交换格式。它基于 ECMAScript(欧洲计算机协会制定的 js 规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。
JSON 的特点:
-
轻量级:相比于 XML,JSON 的数据体积更小
-
易读性:结构清晰,易于人类阅读和编写
-
易解析:机器解析和生成更容易
-
语言无关:虽然源于 JavaScript,但已被多种语言支持
二、JSON 语法规则
JSON 由两种基本结构组成:
-
键值对集合:在各种语言中被实现为对象、记录、字典等
-
有序值列表:在大多数语言中被实现为数组、列表等
基本规则:
-
数据以键值对形式存在
\"key\": value
-
数据由逗号分隔
,
-
大括号
{}
保存对象 -
中括号
[]
保存数组 -
字符串必须使用双引号
\"\"
(不能使用单引号) -
值可以是:
-
字符串(在双引号中)
-
数字(整数或浮点数)
-
布尔值(true 或 false)
-
数组(在中括号中)
-
对象(在大括号中)
-
null
-
示例:
\"name\": \"张三\", \"age\": 30, \"isStudent\": false, \"hobbies\": [\"读书\", \"游泳\", \"编程\"], \"address\": { \"city\": \"北京\", \"street\": \"朝阳路\" }, \"scores\": [85, 92, 78], \"graduate\": null }
三、JSON 的使用方法
1. 在 JavaScript 中使用 JSON
将 JSON 字符串转换为 JavaScript 对象(解析)
const jsonString = \'{\"name\":\"李四\",\"age\":25}\';const obj = JSON.parse(jsonString);console.log(obj.name); // 输出: 李四
将 JavaScript 对象转换为 JSON 字符串(序列化)
const person = { name: \"王五\", age: 28, isEmployed: true};const jsonString = JSON.stringify(person);console.log(jsonString); // 输出: {\"name\":\"王五\",\"age\":28,\"isEmployed\":true}
2. 在前端与后端交互中使用 JSON
发送 JSON 数据到服务器(AJAX 示例)
const data = { username: \"user123\", password: \"securepassword\"};fetch(\'https://api.example.com/login\', { method: \'POST\', headers: { \'Content-Type\': \'application/json\' }, body: JSON.stringify(data)}).then(response => response.json()).then(data => console.log(data)).catch(error => console.error(\'Error:\', error));
从服务器接收 JSON 数据
fetch(\'https://api.example.com/products\') .then(response => response.json()) .then(products => { console.log(products); // 在这里处理产品数据 }) .catch(error => console.error(\'Error:\', error));
3. 在 Node.js 中使用 JSON
读取 JSON 文件
const fs = require(\'fs\');fs.readFile(\'data.json\', \'utf8\', (err, data) => { if (err) throw err; const jsonData = JSON.parse(data); console.log(jsonData);});
写入 JSON 文件
const fs = require(\'fs\');const data = { users: [ { id: 1, name: \"Alice\" }, { id: 2, name: \"Bob\" } ]};fs.writeFile(\'output.json\', JSON.stringify(data, null, 2), (err) => { if (err) throw err; console.log(\'Data written to file\');});
四、JSON 的常见应用场景
-
前后端数据交互:API 请求和响应通常使用 JSON 格式
-
配置文件:许多应用程序使用 JSON 格式的配置文件
-
数据存储:NoSQL 数据库如 MongoDB 使用类似 JSON 的格式存储数据
-
跨平台通信:不同编程语言系统间的数据交换
五、JSON 的注意事项
-
安全性:解析来自不可信来源的 JSON 数据时要注意安全性问题
-
循环引用:对象中存在循环引用时,
JSON.stringify()
会抛出错误 -
数据类型限制:JSON 不支持 JavaScript 的所有数据类型(如函数、undefined)
-
日期对象:JSON 没有日期类型,通常将日期转换为字符串
六、JSON 工具
-
JSON 验证工具:验证 JSON 格式是否正确
-
JSONLint
-
-
JSON 格式化工具:美化 JSON 数据使其更易读
-
浏览器扩展:如 JSON Viewer 等
七、JSON 与 XML 比较
八、JSON 进阶用法
1. 使用 reviver 函数定制解析
const jsonStr = \'{\"name\":\"John\",\"birth\":\"1985-04-12\"}\';const obj = JSON.parse(jsonStr, (key, value) => { if (key === \'birth\') return new Date(value); return value;});console.log(obj.birth.getFullYear()); // 1985
2. 使用 replacer 函数定制序列化
const user = { name: \"John\", age: 30, password: \"secret\"};const jsonStr = JSON.stringify(user, (key, value) => { if (key === \'password\') return undefined; // 排除密码字段 return value;});console.log(jsonStr); // {\"name\":\"John\",\"age\":30}
3. 格式化 JSON 输出
const data = { name: \"John\", age: 30, hobbies: [\"sports\", \"music\"]};console.log(JSON.stringify(data, null, 2));/*输出:{ \"name\": \"John\", \"age\": 30, \"hobbies\": [ \"sports\", \"music\" ]}*/
JSON 是现代 Web 开发中不可或缺的数据格式,掌握它的使用对于前后端开发都非常重要。