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 相关文章推荐
js 幻灯片的实现
Dec 06 Javascript
javascript 进阶篇2 CSS XML学习
Mar 14 Javascript
jquery的ajax()函数传值中文乱码解决方法介绍
Nov 08 Javascript
JS创建对象几种不同方法详解
Mar 01 Javascript
设置点击文本框或图片弹出日历控件的实现代码
May 12 Javascript
jQuery ajax方法传递中文时出现中文乱码的解决方法
Jul 25 Javascript
详解基于 axios 的 Vue 项目 http 请求优化
Sep 04 Javascript
使用vue-cli+webpack搭建vue开发环境的方法
Dec 22 Javascript
在JS循环中使用async/await的方法
Oct 12 Javascript
python虚拟环境 virtualenv的简单使用
Jan 21 Javascript
在Webpack中用url-loader处理图片和字体的问题
Apr 28 Javascript
echarts柱状图背景重叠组合而非并列的实现代码
Dec 10 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手机号码归属地查询代码(API接口/mysql)
2012/09/04 PHP
PHP使用PDO、mysqli扩展实现与数据库交互操作详解
2019/07/20 PHP
js异步加载的三种解决方案
2013/03/04 Javascript
Jquery自定义button按钮的几种方法
2014/06/11 Javascript
详解js闭包
2014/09/02 Javascript
AngularJS入门教程之数据绑定用法示例
2016/11/01 Javascript
Javascript之面向对象--封装
2016/12/02 Javascript
JavaScript实现的选择排序算法实例分析
2017/04/14 Javascript
小程序封装路由文件和路由方法(5种全解析)
2019/05/26 Javascript
使用Vue-Awesome-Swiper实现旋转叠加轮播效果&amp;平移轮播效果
2019/08/16 Javascript
手动实现把python项目发布为exe可执行程序过程分享
2014/10/23 Python
python字典的常用操作方法小结
2016/05/16 Python
Python操作MongoDB详解及实例
2017/05/18 Python
Python实现采用进度条实时显示处理进度的方法
2017/12/19 Python
python字符串常用方法
2018/06/14 Python
如何使用Python进行OCR识别图片中的文字
2019/04/01 Python
python求最大值,不使用内置函数的实现方法
2019/07/09 Python
django2笔记之路由path语法的实现
2019/07/17 Python
keras load model时出现Missing Layer错误的解决方式
2020/06/11 Python
Keras: model实现固定部分layer,训练部分layer操作
2020/06/28 Python
html5指南-2.如何操作document metadata
2013/01/07 HTML / CSS
如何用canvas实现在线签名的示例代码
2018/07/10 HTML / CSS
eBay英国购物网站:eBay.co.uk
2019/06/19 全球购物
澳大利亚在线消费电子产品商店:TobyDeals
2020/01/05 全球购物
莫斯科购买书籍网站:Book24
2020/01/12 全球购物
编程实现当输入某产品代码则打印出该产品记录的功能
2014/05/03 面试题
学校门卫工作职责
2013/12/07 职场文书
工程管理专业毕业生自荐信
2014/01/24 职场文书
公司员工检讨书
2014/02/08 职场文书
群众路线党课主持词
2014/04/01 职场文书
2014年留守儿童工作总结
2014/12/10 职场文书
道德与公民自我评价
2015/03/09 职场文书
励志语录:只有自己足够强大,才能不被别人践踏
2020/01/09 职场文书
导游词之太行山青龙峡
2020/01/14 职场文书
mysql中数据库覆盖导入的几种方式总结
2022/03/25 MySQL
vue使用refs获取嵌套组件中的值过程
2022/03/31 Vue.js