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改变CSS样式(局部和全局)
Dec 18 Javascript
JS 屏蔽按键效果与改变按键效果的示例代码
Dec 24 Javascript
js实现点击链接后延迟3秒再跳转的方法
Jun 05 Javascript
jQuery基于ajax()使用serialize()提交form数据的方法
Dec 08 Javascript
js仿手机页面文件下拉刷新效果
Oct 14 Javascript
Validform表单验证总结篇
Oct 31 Javascript
微信公众号开发 实现点击返回按钮就返回到聊天界面
Dec 15 Javascript
JS实现搜索框文字可删除功能
Dec 28 Javascript
react-redux中connect()方法详细解析
May 27 Javascript
JS实现十字坐标跟随鼠标效果
Dec 25 Javascript
详解如何模拟实现node中的Events模块(通俗易懂版)
Apr 15 Javascript
JavaScript表格隔行变色和Tab标签页特效示例【附jQuery版】
Jul 11 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
php json转换成数组形式代码分享
2014/11/10 PHP
利用php的ob缓存机制实现页面静态化方法
2017/07/09 PHP
PHP通过bypass disable functions执行系统命令的方法汇总
2018/05/02 PHP
基于ThinkPHP删除目录及目录文件函数
2020/10/28 PHP
关于javascript function对象那些迷惑分析
2011/10/24 Javascript
一款jquery特效编写的大度宽屏焦点图切换特效的实例代码
2013/08/05 Javascript
javascript实现自动输出文本(打字特效)
2015/08/27 Javascript
jquery解析json格式数据的方法(对象、字符串)
2015/11/24 Javascript
jQuery如何使用自动触发事件trigger
2015/11/29 Javascript
jQuery 选择器(61种)整理总结
2016/09/26 Javascript
js插件Jcrop自定义截取图片功能
2016/10/14 Javascript
JS创建Tag标签的方法详解
2017/06/09 Javascript
鼠标拖动改变DIV等网页元素的大小的实现方法
2017/07/06 Javascript
温故知新——JavaScript中的字符串连接问题最全总结(推荐)
2017/08/21 Javascript
vue计算属性和监听器实例解析
2018/05/10 Javascript
浅谈webpack SplitChunksPlugin实用指南
2018/09/17 Javascript
小程序开发中如何使用async-await并封装公共异步请求的方法
2019/01/20 Javascript
React Native 混合开发多入口加载方式详解
2019/09/23 Javascript
javascript实现贪吃蛇经典游戏
2020/04/10 Javascript
vue 计算属性和侦听器的使用小结
2021/01/25 Vue.js
谈谈Python进行验证码识别的一些想法
2016/01/25 Python
python制作websocket服务器实例分享
2016/11/20 Python
如何用C代码给Python写扩展库(Cython)
2019/05/17 Python
深入浅析Python科学计算库Scipy及安装步骤
2019/10/12 Python
关于python 的legend图例,参数使用说明
2020/04/17 Python
Python爬虫实现vip电影下载的示例代码
2020/04/20 Python
Python中三维坐标空间绘制的实现
2020/09/22 Python
CSS3哪些新特性值得称赞
2016/03/02 HTML / CSS
html5摇一摇代码优化包括DeviceMotionEvent等等
2014/09/01 HTML / CSS
HTML5无刷新改变当前url的代码
2017/03/15 HTML / CSS
以下为Windows NT 下的32 位C++程序,请计算sizeof 的值
2016/12/07 面试题
社区包粽子活动方案
2014/01/21 职场文书
预备党员入党自我评价范文
2014/03/10 职场文书
竞选大队长演讲稿
2014/04/29 职场文书
教师四风自我剖析材料
2014/09/30 职场文书
英语导游词
2015/02/13 职场文书