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实现锚点(Anchor)间平滑跳转
Sep 08 Javascript
Jquery动态改变图片IMG的src地址示例
Jun 25 Javascript
Node.js模拟浏览器文件上传示例
Mar 26 Javascript
JavaScript中setUTCFullYear()方法的使用简介
Jun 12 Javascript
BootStrap3学习笔记(一)之网格系统
May 20 Javascript
jQuery实现淡入淡出的模态框
Feb 09 Javascript
Vue中的v-cloak使用解读
Mar 27 Javascript
react native实现往服务器上传网络图片的实例
Aug 07 Javascript
JavaScript深拷贝和浅拷贝概念与用法实例分析
Jun 07 Javascript
微信小程序中时间戳和日期的相互转换问题
Jul 09 Javascript
Element-UI踩坑之Pagination组件的使用
Oct 29 Javascript
javascript定时器的简单应用示例【控制方块移动】
Jun 17 Javascript
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程序61条面向对象分析设计的经验小结
2008/11/12 PHP
比较时间段一与时间段二是否有交集的php函数
2011/05/31 PHP
php array_filter除去数组中的空字符元素
2020/06/21 PHP
php桥接模式应用案例分析
2019/10/23 PHP
jQeury淡入淡出需要注意的问题
2010/09/08 Javascript
使用jQuery制作遮罩层弹出效果的极简实例分享
2016/05/12 Javascript
jQuery bt气泡实现悬停显示及移开隐藏功能的方法
2016/07/12 Javascript
jstree创建无限分级树的方法【基于ajax动态创建子节点】
2016/10/25 Javascript
JS限制条件补全问题实例分析
2016/12/16 Javascript
jquery实现自适应banner焦点图
2017/02/16 Javascript
基于Node.js的WebSocket通信实现
2017/03/11 Javascript
Node.js之网络通讯模块实现浅析
2017/04/01 Javascript
Vue.js实现模拟微信朋友圈开发demo
2017/04/20 Javascript
js中apply和Math.max()函数的问题及区别介绍
2018/03/27 Javascript
JavaScript常用数学函数用法示例
2018/05/14 Javascript
微信小程序云函数使用mysql数据库过程详解
2019/08/07 Javascript
React-redux实现小案例(todolist)的过程
2019/09/29 Javascript
js实现多图和单图上传显示
2019/12/18 Javascript
微信小程序文章列表功能完整实例
2020/06/03 Javascript
JS实现简易贪吃蛇游戏
2020/08/24 Javascript
[07:47]DOTA2国际邀请赛采访专栏:探访Valve总部
2013/08/08 DOTA
[01:09]DOTAPLUS——DOTA2的新时代
2018/04/04 DOTA
python生成器的使用方法
2013/11/21 Python
跟老齐学Python之从格式化表达式到方法
2014/09/28 Python
Python中标准库OS的常用方法总结大全
2017/07/19 Python
python实现手机通讯录搜索功能
2018/02/22 Python
解决Tensorflow sess.run导致的内存溢出问题
2020/02/05 Python
python pyqtgraph 保存图片到本地的实例
2020/03/14 Python
Python做图像处理及视频音频文件分离和合成功能
2020/11/24 Python
html2canvas截图空白问题的解决
2020/03/24 HTML / CSS
大学生简单自荐信
2013/11/10 职场文书
幼儿评语大全
2014/04/30 职场文书
五年级作文之成长
2019/09/16 职场文书
Java实现聊天机器人完善版
2021/07/04 Java/Android
Python使用psutil库对系统数据进行采集监控的方法
2021/08/23 Python
mysql 排序失效
2022/05/20 MySQL