JSON+JavaScript处理JSON的简单例子


Posted in Javascript onMarch 20, 2013

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。它基于JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999的一个子集。 JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)。这些特性使JSON成为理想的数据交换语言。

JSON建构于两种结构:

1、“名称/值”对的集合(A collection of name/value pairs)。不同的语言中,它被理解为对象(object),纪录(record),结构(struct),字典(dictionary),哈希表 (hash table),有键列表(keyed list),或者关联数组 (associative array)。

2、值的有序列表(An ordered list of values)。在大部分语言中,它被理解为数组(array)。

这些都是常见的数据结构。事实上大部分现代计算机语言都以某种形式支持它们。这使得一种数据格式在同样基于这些结构的编程语言之间交换成为可能。

JSON具有以下这些形式:

•对象是一个无序的“‘名称/值'对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值' 对”之间使用“,”(逗号)分隔。
•数组是值(value)的有序集合。一个数组以“[”(左中括号)开始,“]”(右中括号)结束。值之间使用“,”(逗号)分隔。
•值(value)可以是双引号括起来的字符串(string)、数值(number)、true、false、 null、对象(object)或者数组(array)。这些结构可以嵌套。
•字符串(string)是由双引号包围的任意数量Unicode字符的集合,使用反斜线转义。一个字符(character)即一个单独的字符串(character string)。
•字符串(string)与C或者Java的字符串非常相似。
•数值(number)也与C或者Java的数值非常相似。除去未曾使用的八进制与十六进制格式。除去一些编码细节。
•空白可以加入到任何符号之间。 以下描述了完整的语言。
JSON举例(javascript中使用json):

<script type="text/javascript">
var user = 
          {
            "Id":1,
            "Name":"Hubery",
            "Age":23,
            "Address":
              {
                  "City":"Beijing","ZipCode":"111111"
              },
            "Email":"hubery@3water.com"
          };          alert(user.Id);
          alert(user.Name);
          alert(user.Age);
          alert(user.Address.City);
          alert(user.Address.ZipCode);
          alert(user.Email);
</script>
下面我们把Address属性定义成数组,用户有两个Address:

<script type="text/javascript">
var user = 
          {
            "Id":1,
            "Name":"Hubery",
            "Age":23,
            "Address":
              [
                {"City":"Beijing","ZipCode":"111111"},
                {"City":"Langfang","ZipCode":"222222"}
              ],
            "Email":"hubery@3water.com"
          };
          alert(user.Id);
          alert(user.Name);
          alert(user.Age);
          alert(user.Address[0].City);//还可以这样:alert(user.Address[0]["City"]);
          alert(user.Address[0].ZipCode);
          alert(user.Address[1].City);
          alert(user.Address[1].ZipCode);
          alert(user.Email);
</script>

如果我们想要一个用户列表,能行吗?答案是,没问题!

<script type="text/javascript">
var user = 
          [
              {
                "Id":1,
                "Name":"Hubery",
                "Age":23,
                "Address":
                  [
                    {"City":"Beijing","ZipCode":"111111"},
                    {"City":"Langfang","ZipCode":"222222"}
                  ],
                "Email":"hubery@3water.com"
              },
              {
                "Id":2,
                "Name":"Chris",
                "Age":24,
                "Address":{"City":"Beijing","ZipCode":"100085"},
                "Email":"chris@3water.com"
              }
          ]          alert("Id: "+user[0].Id+"\r\nName: "+
          user[0].Name+"\r\nAge: "+
          user[0].Age+"\r\nAddress: ("+
          user[0].Address[0].City+","+user[0].Address[0].ZipCode+") ("+user[0].Address[1].City+","+user[0].Address[1].ZipCode+")\r\nEmail: "+
          user[0].Email);
          alert("Id: "+user[1].Id+"\r\nName: "+
          user[1].Name+"\r\nAge: "+
          user[1].Age+"\r\nAddress: ("+
          user[1].Address.City+","+user[1].Address.ZipCode+")\r\nEmail: "+
          user[1].Email);
</script>
Javascript 相关文章推荐
javascript学习笔记(七) js函数介绍
Jun 19 Javascript
js弹出模式对话框,并接收回传值的方法
Mar 12 Javascript
JS实现遮罩层效果的简单实例
Nov 12 Javascript
控制台报错object is not a function的解决方法
Aug 24 Javascript
JQuery控制radio选中和不选中方法总结
Apr 15 Javascript
javascript事件委托的方式绑定详解
Jun 10 Javascript
Jquery attr()方法 属性赋值和属性获取详解
Apr 15 Javascript
一步步教你利用webpack如何搭一个vue脚手架(超详细讲解和注释)
Jan 08 Javascript
详解开发react应用最好用的脚手架 create-react-app
Apr 24 Javascript
node之本地服务器图片上传的方法示例
Mar 26 Javascript
Javascript三种字符串连接方式及性能比较
May 28 Javascript
jquery实现淡入淡出轮播图效果
Dec 13 jQuery
js或者jquery判断图片是否加载完成实现代码
Mar 20 #Javascript
javascript 三种方法实现获得和设置以及移除元素属性
Mar 20 #Javascript
asp.net中System.Timers.Timer的使用方法
Mar 20 #Javascript
js控制的回到页面顶端goTop的代码实现
Mar 20 #Javascript
让图片旋转任意角度及JQuery插件使用介绍
Mar 20 #Javascript
jquery在Chrome下获取图片的长宽问题解决
Mar 20 #Javascript
javascript中[]和{}对象使用介绍
Mar 20 #Javascript
You might like
Admin generator, filters and I18n
2011/10/06 PHP
PHP receiveMail实现收邮件功能
2018/04/25 PHP
PHP+redis实现的购物车单例类示例
2019/02/02 PHP
利用ASP发送和接收XML数据的处理方法与代码
2007/11/13 Javascript
判断浏览器的javascript版本的代码
2010/09/03 Javascript
jQuery实现购物车数字加减效果
2015/03/14 Javascript
JS实现兼容性好,自动置顶的淘宝悬浮工具栏效果
2015/09/18 Javascript
关于获取DIV内部内容报错的原因分析及解决办法
2016/01/29 Javascript
全面了解JS中的匿名函数
2016/06/29 Javascript
JS在Chrome浏览器中showModalDialog函数返回值为undefined的解决方法
2016/08/03 Javascript
最好用的Bootstrap fileinput.js文件上传组件
2016/12/12 Javascript
基于Vue2的独立构建与运行时构建的差别(详解)
2017/12/06 Javascript
深入理解Node内建模块和对象
2019/03/12 Javascript
微信小程序访问豆瓣电影api的实现方法
2019/03/31 Javascript
[38:42]完美世界DOTA2联赛循环赛 Matador vs Forest BO2第二场 11.05
2020/11/05 DOTA
Python使用正则匹配实现抓图代码分享
2015/04/02 Python
Python实现对字符串的加密解密方法示例
2017/04/29 Python
详解Python核心编程中的浅拷贝与深拷贝
2018/01/07 Python
Python常见字典内建函数用法示例
2018/05/14 Python
使用python获取电脑的磁盘信息方法
2018/11/01 Python
利用arcgis的python读取要素的X,Y方法
2018/12/22 Python
Python装饰器限制函数运行时间超时则退出执行
2019/04/09 Python
pygame实现打字游戏
2021/02/19 Python
在Python中使用turtle绘制多个同心圆示例
2019/11/23 Python
Python3 pickle对象串行化代码实例解析
2020/03/23 Python
详解CSS3中的box-sizing(content-box与border-box)
2019/04/19 HTML / CSS
工商管理专业实习大学生自我鉴定
2013/09/19 职场文书
工作疏忽检讨书
2014/01/25 职场文书
元旦趣味活动方案
2014/08/22 职场文书
教师群众路线教育实践活动个人对照检查材料
2014/11/04 职场文书
影视后期实训报告
2014/11/05 职场文书
优秀党员事迹材料
2014/12/18 职场文书
投资合作意向书范本
2015/05/08 职场文书
新年晚会主持词开场白
2015/05/28 职场文书
《叶问2》观后感
2015/06/15 职场文书
Python实现制作销售数据可视化看板详解
2021/11/27 Python