1. 什么是JSON
JSON---Javascript Object Notation,前两个单词大家应该都认识,最后一个notation,是“记号、标记法”的意思,连在一起,便成了JSON。
它是一种轻量级的数据交换格式,是基于Javascript的一个子集,可以叫做Javascript对象表示法,是存储和交换文本信息的语法,但它并不是Javascript独有的数据格式,其它很多语言都可以对JSON进行解析和序列化。
2. JSON的由来
在21世纪初,Douglas Crockford(Web开发领域最知名的技术权威之一,ECMA JavaScript2.0标准化委员会委员,被JavaScript之父Brendan Eich称为JavaScript的大宗师(Yoda),曾任Yahoo!资深JavaScript架构师,现任PayPal高级JavaScript架构师)试图寻找一种更加简便的数据交换格式,能够在服务器之间交换数据,当时通用的数据交换语言是XML,但是Douglas Crockford认为XML的生成与解析都过于麻烦,所以他提出了一种更加简化的格式,就是我们现在使用的JSON。
JSON的规格十分简单,只用一个页面几百个字就能说清楚,而且Douglas Crackford称这个规格永远不用升级,因为该规定的都已经规定好了。
3. 为什么要用JSON
JSON类似于XML,比XML更小、更快、更容易解析。但同时XML也有它的不可替代性,应根据使用场景进行更合适的选择;
JSON语法简单,很容易理解,并且对象信息自描述,数据传输量小不占用带宽;
JSON虽然远不及emoji这一世界通用语言,但其实它的支持度也已经非常可观,支持的语言包括C,C#,Java,JavaScript,PHP,Python,Ruby等等;
对于Ajax应用程序来说,JSON比XML更快捷,更易用;
JSON的可读性、可扩展性都非常好,编码难度也比较低,即使不借助工具也能写出比较规范的JSON
......
4. JSON怎么用
⑴ JSON的基本语法
① 并列的数据之间用逗号( , )分隔
② 映射用冒号( : )表示
③ 映射的集合用大括号( {} )表示
④ 并列数据的集合用方括号( [] )表示
例如:
上赛季的MVP是斯蒂芬库里,场上位置是控球后卫,球衣号码是30号,球队是金州勇士队
上赛季的FMVP是勒布朗詹姆斯,场上位置是小前锋,球衣号码是23号,球队是克里夫兰骑士队
用JSON格式就可以表示为:
  1. [{
  2. "MVP":"Stephen Curry",
  3. "position":"Point Guard",
  4. "number":"30",
  5. "team":"Golden State Warriors"
  6. },{
  7. "FMVP":"Lebron James",
  8. "position":"Small Forward",
  9. "number":"23",
  10. "team":"Cleveland Cavaliers"
  11. }]

  更复杂的数据也可以使用JSON来进行表示,比如下面这段信息:最喜欢的编辑器是sublime,最喜欢的运动是篮球,最喜欢的球队是马刺队,马刺队控卫有托尼帕克、帕蒂米尔斯,分卫有马努吉诺比利、丹尼格林,小前锋有科怀伦纳德、凯尔安德森,大前锋有拉马库斯阿尔德里奇、大卫李,中锋有德维恩戴德蒙、保罗加索尔。  

  1. {
  2. "favoriteEditor": "sublime",
  3. "favoriteSport": "basketball",
  4. "favoriteTeam":{
  5. "Spurs":[
  6. {
  7. "PG":"Tony Parker",
  8. "SG":"Danny Green",
  9. "SF":"Kawhi Leonard",
  10. "PF":"LaMarcus Aldridge",
  11. "C":"Pau Gasol"
  12. },
  13. {
  14. "PG":"Patty Mills",
  15. "SG":"Manu Ginobili",
  16. "SF":"Kyle Anderson",
  17. "PF":"David Lee",
  18. "C":"Dewayne Dedmon"
  19. }
  20. ]
  21. }
  22. }
⑵ JSON的解析与序列化
① 通过eval()函数将JSON字符串解析为JavaScript原生值
  1. var str = '[{"name":"james","height":"203","number":"23"}, {"name":"kobe","height":"198","number":"24"}]'; //定义JSON字符串
  2. var oJson = eval(str); //通过eval()函数解析拿到JavaScript原生值
  3. //接下来便可通过JS进行操作
  4. alert(oJson[0].name); //james
  5. alert(oJson[1].height); //
需要注意的是,这种方法存在着一定的安全隐患,有可能会执行一些恶意代码,使用的时候要谨慎。
② 通过全局对象JSON的两个方法parse()和stringify()进行操作
parse()可以将JSON字符串转化为JavaScript原生值:
  1. var str = '[{"name":"james","height":"203","number":"23"},{"name":"kobe","height":"198","number":"24"}]'; //定义JSON字符串
  2. var oJson = JSON.parse(str); //通过JSON对象的parse方法得到该JSON字符串的JavaScript原生值
  3. document.write("姓名:" + oJson[1].name + "<br/>" + "身高:" + oJson[1].height + "cm" + "<br/>" + "球衣号码:" + oJson[1].number);

parse()也可以传第二个参数,此时可以在还原出JavaScript值的时候将原值替换成自己想要的值,如下:
  1. var str = '[{"name":"james","height":"203","number":"23"},{"name":"kobe","height":"198","number":"24"}]';
  2. var oJson = JSON.parse(str, function(key, value){
  3. if('name' == key){
  4. return '球员' + value;
  5. }else if('number' == key){
  6. return value + '号球衣';
  7. }else{
  8. return value;
  9. }
  10. });
  11. alert(oJson[0].name + '更牛逼还是' + oJson[1].name + '更牛逼' + '\n' + '你喜欢' + oJson[0].number + '还是' + oJson[1].number);

stringify()可以将原生JavaScript值转换为JSON字符串:
  1. var oJson = [{
  2. name : "james",
  3. height : 203,
  4. number : 23
  5. },{
  6. name : "kobe",
  7. height : 198,
  8. number : 24
  9. }];
  10. var jsonStr = JSON.stringify(oJson,['name','number'],4);
  11. alert(jsonStr);

JSON.stringify(oJson,['name','number'],4);中的第一个参数表示需要转化的JS对象;第二个参数用于过滤结果,表示只留下name和number,其他的key以及所对应的的value都不要了;第三个参数表示在JSON字符串中保留的缩进数,有缩进时可读性更高,该参数也可以是一个字符串,比如'----',此时弹出结果如下:

如果不需要保留缩进,那么最后一个参数空起来即可,但如果不需要进行过滤,第二个参数需设置为null占位,不能空起来,否则最后一个参数也会失效。
第二个参数也可以是函数,函数可以进行更加复杂的过滤:
  1. var oJson = [{
  2. name : "james",
  3. height : 203,
  4. position : '小前锋'
  5. },{
  6. name : "kobe",
  7. height : 198,
  8. position : '得分后卫'
  9. }];
  10. var jsonStr = JSON.stringify(oJson,function(key,value){
  11. switch(key){
  12. case 'name':
  13. return '球员 ' + value;
  14. case 'height':
  15. return '身高 ' + value + 'cm';
  16. case 'position':
  17. return '位置 ' + value;
  18. default:
  19. return value;
  20. }
  21. },4);
  22. alert(jsonStr);

  支持JSON对象的浏览器有IE8+、Chrome、FireFox3.5+、Opera10.5+、Safari4+,不支持的浏览器可以通过json.js这一开源库来进行模拟。

初学者看过来之JSON入门的更多相关文章

  1. 没有基础的初学者学java怎样快速入门?超全的学习路线图

    现在地球人都知道互联网行业工资高,上万都是小case,不值一提.可是对于大部分人来说,工资七八千都算很难了.那我也想学java,当程序员,赚大钱.可是作为一个初学者,怎样才可以快速入门呢?早点入门就可 ...

  2. 你一定喜欢看的 Webpack 2.× 入门实战(转载)

    最近在学习 Webpack,网上大多数入门教程都是基于 Webpack 1.x 版本的,我学习 Webpack 的时候是看了 zhangwang 的 <<入门 Webpack,看这篇就够了 ...

  3. 你一定喜欢看的 Webpack 2.× 入门实战

    from:https://www.jianshu.com/p/b83a251d53db?utm_campaign=maleskine&utm_content=note&utm_medi ...

  4. JSON入门指南--客户端处理JSON

    在传统的Web开发过程中,前端工程师或者后台工程师会在页面上写后台的相关代码,比如在ASP.NET MVC4里面写如下代码: @Html.TextBoxFor(m => m.UserName, ...

  5. 【Unity3D基础教程】给初学者看的Unity教程(四):通过制作Flappy Bird了解Native 2D中的RigidBody2D和Collider2D

    作者:王选易,出处:http://www.cnblogs.com/neverdie/ 欢迎转载,也请保留这段声明.如果你喜欢这篇文章,请点[推荐].谢谢! 引子 在第一篇文章[Unity3D基础教程] ...

  6. JSON入门看这一篇就够了

    什么是JSON JSON:JavaScript Object Notation [JavaScript 对象表示法] JSON 是存储和交换文本信息的语法.类似 XML. JSON采用完全独立于任何程 ...

  7. ASP.NET Core 使用 SQLite 教程,EF SQLite教程,修改模型更新数据库,适合初学者看懂详细、简单教程

    SQLIte 操作方便,简单小巧,这里笔者就不再过多介绍,感兴趣可以到以下博文 https://blog.csdn.net/qq_31930499/article/details/80420246 文 ...

  8. JSON入门指南--服务端处理JSON

    平时公司使用的ASP.NET MVC3来开发Web项目,其实在ASP.NET中已经原生的支持JSON.所以基本不需要引进Newtonsoft.Json.dll.下面看在MVC4中,后台生成JSON数据 ...

  9. (Spring4 json入门)Spring4+SpringMVC+页面数据发送与接收(json格式)

    jar包(Maven仓库): Spring4 jar包(Maven仓库): 在测试过程中我查看了网上的一些教程,但是那些教程都是在Spring3环境下的,Spring3和Spring4解析json需要 ...

随机推荐

  1. 再讲IQueryable<T>,揭开表达式树的神秘面纱

    接上篇<先说IEnumerable,我们每天用的foreach你真的懂它吗?> 最近园子里定制自己的orm那是一个风生水起,感觉不整个自己的orm都不好意思继续混博客园了(开个玩笑).那么 ...

  2. 传播正能量——做一个快乐的程序员

    引子 今天在博客园看到施瓦小辛格的文章我们搞开发的为什么会感觉到累,顿时有感而发.自己本来不擅长写文章,更不擅长写这种非技术性的文章,但是在思绪喷薄之际,还是止不住有很多话要说.针对从客观上说&quo ...

  3. [NodeJS] 优缺点及适用场景讨论

    概述: NodeJS宣称其目标是“旨在提供一种简单的构建可伸缩网络程序的方法”,那么它的出现是为了解决什么问题呢,它有什么优缺点以及它适用于什么场景呢? 本文就个人使用经验对这些问题进行探讨. 一. ...

  4. IE的F12开发人员工具不显示问题

    按下F12之后,开发人员工具在桌面上看不到,但是任务栏里有显示.将鼠标放在任务栏的开发人员工具上,出现一片透明的区域,选中之后却出不来.将鼠标移动到开发人员工具的缩略图上,右键-最大化,工具就全屏出现 ...

  5. Content Security Policy 入门教程

    阮一峰文章:Content Security Policy 入门教程

  6. 【开源】.net 分布式架构之监控平台

    开源地址:http://git.oschina.net/chejiangyi/Dyd.BaseService.Monitor .net 简单监控平台,用于集群的性能监控,应用耗时监控管理,统一日志管理 ...

  7. 算法与数据结构(十四) 堆排序 (Swift 3.0版)

    上篇博客主要讲了冒泡排序.插入排序.希尔排序以及选择排序.本篇博客就来讲一下堆排序(Heap Sort).看到堆排序这个名字我们就应该知道这种排序方式的特点,就是利用堆来讲我们的序列进行排序.&quo ...

  8. 如何利用tcpdump对mysql进行抓包操作

    命令如下: tcpdump -s -l -w - dst -i eno16777736 |strings 其中-i指定监听的网络接口,在RHEL 7下,网络接口名不再是之前的eth0,而是 eno16 ...

  9. 邮件中嵌入html中要注意的样式

    工作中常会有需求向用户发送邮件,需要前端工程师来制作html格式的邮件,但是由于邮件客户端对样式的支持有限,要兼容很多种浏览器需要注意很多原则: 1.邮件使用table+css布局 2.邮件主要部分在 ...

  10. python10作业思路及源码:类Fabric主机管理程序开发(仅供参考)

    类Fabric主机管理程序开发 一,作业要求 1, 运行程序列出主机组或者主机列表(已完成) 2,选择指定主机或主机组(已完成) 3,选择主机或主机组传送文件(上传/下载)(已完成) 4,充分使用多线 ...