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 相关文章推荐
IE事件对象(The Internet Explorer Event Object)
Jun 27 Javascript
基于jquery创建的一个图片、视频缓冲的效果样式插件
Aug 28 Javascript
angularjs学习笔记之完整的项目结构
Sep 26 Javascript
不用一句js代码初始化组件
Jan 27 Javascript
jQuery AjaxUpload 上传图片代码
Feb 02 Javascript
JS DOMReady事件的六种实现方法总结
Nov 23 Javascript
jQuery Plupload上传插件的使用
Apr 19 jQuery
js 客户端打印html 并且去掉页眉、页脚的实例
Nov 03 Javascript
JS实现自定义弹窗功能
Aug 08 Javascript
Vue利用localStorage本地缓存使页面刷新验证码不清零功能的实现
Sep 04 Javascript
JavaScript常用进制转换及位运算实例解析
Oct 14 Javascript
vue实现无缝轮播效果(跑马灯)
May 14 Vue.js
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
如何解决CI框架的Disallowed Key Characters错误提示
2013/07/05 PHP
php获取本周星期一具体日期的方法
2015/04/20 PHP
利用PHP实现一个简单的用户登记表示例
2017/04/25 PHP
详解thinkphp5+swoole实现异步邮件群发(SMTP方式)
2017/10/13 PHP
tp5 实现列表数据根据状态排序
2019/10/18 PHP
PHP标准库 (SPL)――Countable用法示例
2020/06/05 PHP
JavaScript.The.Good.Parts阅读笔记(二)作用域&amp;闭包&amp;减缓全局空间污染
2010/11/16 Javascript
动态添加option及createElement使用示例
2014/01/26 Javascript
JQuery中Ajax()的data参数类型实例分析
2015/12/15 Javascript
在vue.js中使用JSZip实现在前端解压文件的方法
2018/09/05 Javascript
微信小程序车牌号码模拟键盘输入功能的实现代码
2018/11/11 Javascript
Vue指令之 v-cloak、v-text、v-html实例详解
2019/08/08 Javascript
Vant 中的Toast设置全局的延迟时间操作
2020/11/04 Javascript
[04:37]DOTA2英雄梦之声Vol20发条
2014/06/20 DOTA
pycharm 使用心得(八)如何调用另一文件中的函数
2014/06/06 Python
Python xlrd读取excel日期类型的2种方法
2015/04/28 Python
Python定时执行之Timer用法示例
2015/05/27 Python
编写Python爬虫抓取豆瓣电影TOP100及用户头像的方法
2016/01/20 Python
Python学习小技巧之利用字典的默认行为
2017/05/20 Python
python3.5+tesseract+adb实现西瓜视频或头脑王者辅助答题
2018/01/17 Python
python list是否包含另一个list所有元素的实例
2018/05/04 Python
解决Django生产环境无法加载静态文件问题的解决
2019/04/23 Python
树莓派极简安装OpenCv的方法步骤
2019/10/10 Python
TensorFlow——Checkpoint为模型添加检查点的实例
2020/01/21 Python
python如何解析复杂sql,实现数据库和表的提取的实例剖析
2020/05/15 Python
Django使用rest_framework写出API
2020/05/21 Python
CSS3 transforms应用于背景图像的解决方法
2019/04/16 HTML / CSS
HTML5的video标签的浏览器兼容性增强方案分享
2016/05/19 HTML / CSS
澳大利亚珠宝商:Shiels
2019/10/06 全球购物
金属材料工程个人求职的自我评价
2013/12/04 职场文书
学校门卫工作职责
2013/12/07 职场文书
六一儿童节活动策划方案
2014/01/27 职场文书
应聘会计求职信
2014/06/11 职场文书
委托函范文
2015/01/29 职场文书
详解Python requests模块
2021/06/21 Python
Ubuntu Server 安装Tomcat并配置systemctl
2022/04/28 Servers