JSON扫盲帖 JSON.as类教程


Posted in Javascript onFebruary 16, 2009

补充内容:
如果json字符串是从html用FlashVars来传递参数时那么字符串中的第一个双引号(包括双引号)以后的内容就不会得到传送. 而adobe的官方json.as类包里解析josn对象中是少不了双引号的. 所以搞了半天只后用个字符串替换函数啦!
方法看另一篇文章:
html传带双引号的参数给flash解决方案
--------------------------------------------------------------------------------------
先看下面的转载内容吧! 前面这些是根据自己的需求的补充内容:
--------------------------------------------------------------------------------------
昨天发了json的AS3解析类,从大家的跟帖上来看,好多人还是不知道这个东西的,特建一个扫盲贴。
其实在AS中使用json其实并不是一个必须或是很好的选择,因为AS对xml的解析已经很不错了,但是为什么可以考虑使用json呢,有以下几点:
json是介于单纯的文本方式(如:firstName=Brett&lastName=McLaughlin&email=brett@newInstance.com)和xml(<request><firstName>Brett</firstName><lastName>McLaughlin</lastName><email>brett@newInstance.com</email></request>)中间的一种格式,他具有文本和xml的中性优势:数据量小和清晰的数据格式。
json是JavaScript Object Notation的简写,那么意思就是说他是来自于javascript的东西。因为现在ajax的流行,大部分网站会采用ajax的模式和构架,那么json会是一个数据传输的首选(文本方式太简单,要是大数据量的时候无法理解,xml的方式数据量大,在解析的时候会增加服务器负担),那么要是一个网站从ajax构架的基础上出一个flex/flash版的界面的时候使用json会最少地减少服务器端的程序改动。
服务器端现在有成熟的JSON解析代码(因为JSON运用太广泛了),那么在开发的时候也不用担心服务器端的解析。
ps:我怎么只能想到上面三点啊,会不会理由太少了?
JSON 是什么?
简单 JSON 示例
按照最简单的形式,可以用下面这样的 JSON 表示名称/值对:

{ "firstName": "Brett" }

复制代码这个示例非常基本,而且实际上比等效的纯文本名称/值对占用更多的空间:
firstName=Brett

复制代码但是,当将多个名称/值对串在一起时,JSON 就会体现出它的价值了。首先,可以创建包含多个名称/值对的记录,比如:
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" }

复制代码从语法方面来看,这与名称/值对相比并没有很大的优势,但是在这种情况下 JSON 更容易使用,而且可读性更好。例如,它明确地表示以上三个值都是同一记录的一部分;花括号使这些值有了某种联系。
值的数组
当需要表示一组值时,JSON 不但能够提高可读性,而且可以减少复杂性。例如,假设您希望表示一个人名列表。在 XML 中,需要许多开始标记和结束标记;如果使用典型的名称/值对(就像在本系列前面文章中看到的那种名称/值对),那么必须建立一种专有的数据格式,或者将键名称修改为 person1-firstName 这样的形式。
如果使用 JSON,就只需将多个带花括号的记录分组在一起:
{ "people": [ 
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" }, 
{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" }, 
{ "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" } 
]}

复制代码这不难理解。在这个示例中,只有一个名为 people 的变量,值是包含三个条目的数组,每个条目是一个人的记录,其中包含名、姓和电子邮件地址。上面的示例演示如何用括号将记录组合成一个值。当然,可以使用相同的语法表示多个值(每个值包含多个记录): { "programmers": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" }, 
{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" }, 
{ "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" } 
], 
"authors": [ 
{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" }, 
{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" }, 
{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" } 
], 
"musicians": [ 
{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" }, 
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" } 
] 
}

复制代码这里最值得注意的是,能够表示多个值,每个值进而包含多个值。但是还应该注意,在不同的主条目(programmers、authors 和 musicians)之间,记录中实际的名称/值对可以不一样。JSON 是完全动态的,允许在 JSON 结构的中间改变表示数据的方式。
在处理 JSON 格式的数据时,没有需要遵守的预定义的约束。所以,在同样的数据结构中,可以改变表示数据的方式,甚至可以以不同方式表示同一事物。
ps:以上例子都是来自http://www.ibm.com/developerworks/cn/web/wa-ajaxintro10/,掌握 Ajax,自己懒,看人家有就顺便用了

当当当,我又回来了,上周忙这上班没顾上写用法,下面就介绍一下adobe的json类的用法。
上次发表的json类有问题(http://bbs.actionscript3.cn/thread-1625-1-1.html),因为我也是从别人处下载的,谁知道是一个半成品。望大家别生气啊,建议管理员给删除了!
这次是adobe的官方的类,我修改了一下包,这次就可以用了。
下面是教程,比较简单:
1、服务器端来的json
怎么样获得服务器端的json我就不说了吧(就是通讯),那么得到的应该是一个字符串,存入变量serverJSON,使用方式如下:

import json.*; 
var json:Object = new Object(); 
json = JSON.decode(serverJSON);

json就是一个对象了,简单吧。
举一个例子:
上面的JSON的一段代码:

{ "programmers": [ 
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" }, 
{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" }, 
{ "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" } 
], 
"authors": [ 
{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" }, 
{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" }, 
{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" } 
], 
"musicians": [ 
{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" }, 
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" } 
] 
}

存入变量:serverJSON
代码:
var serverJSON:String = '{ "programmers": [{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" },{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" }, { "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" }],"authors": [{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }],"musicians": [{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }]}' 
var s:Object = JSON.decode(serverJSON); 
//开始使用 
trace(s.programmers[0].firstName);//输出:Brett

不是吧这么简单。其实转变后就成为一个对象了,可以通过点语法来访问这些值了。XML靠边去。
2、本地对象做成JSON
你要是能自己拼出JSON字符串也可以,不过我们是在面向对象的世界啊,那么我们都是对象啊,到时候对象直接就可以来用了。
举一个例子:

import json.*; 
var myObject:Object = new Object(); 
myObject.ab = "adfsdf"; 
myObject.cd = Math.random(); 
trace(JSON.encode( myObject ));//输出:{"ab":"adfsdf","cd":0.0599129400216043}

这样就可以给服务器了。
总结:就两个方法,JSON.decode(String),JSON.encode(Object),有这么简单的方式实现传输量小,而且简单的数据格式,我们为什么还不用呢?
其实XML自然也有他自己的强势,当一个结构复杂的数据结构出现的时候,这个时候JSON就很难搞定了,XML就是首选了。
Javascript 相关文章推荐
JavaScript中Cookies的相关使用教程
Jun 04 Javascript
js+div实现文字滚动和图片切换效果代码
Aug 27 Javascript
详解Node.js:events事件模块
Nov 24 Javascript
jQuery弹出div层过2秒自动消失
Nov 29 Javascript
ES6概念 Symbol toString()方法
Dec 25 Javascript
基于vue实现swipe分页组件实例
May 25 Javascript
Angular.js项目中使用gulp实现自动化构建以及压缩打包详解
Jul 19 Javascript
bootstrap fileinput实现文件上传功能
Aug 23 Javascript
Angular2仿照微信UI实现9张图片上传和预览的示例代码
Oct 19 Javascript
Vue Router的手写实现方法实现
Mar 02 Javascript
Vue中keep-alive的两种应用方式
Jul 15 Javascript
vue使用wavesurfer.js解决音频可视化播放问题
Apr 04 Vue.js
动态为事件添加js代码示例
Feb 15 #Javascript
Ext JS Grid在IE6 下宽度的问题解决方法
Feb 15 #Javascript
javascript Ext JS 状态默认存储时间
Feb 15 #Javascript
Javascript 获取链接(url)参数的方法
Feb 15 #Javascript
JavaScript 获得选中文本内容的方法
Feb 15 #Javascript
检测是否已安装 .NET Framework 3.5的js脚本
Feb 14 #Javascript
Javascript 跨域访问解决方案
Feb 14 #Javascript
You might like
PHP SPL标准库之数据结构堆(SplHeap)简单使用实例
2015/05/12 PHP
在 Laravel 6 中缓存数据库查询结果的方法
2019/12/11 PHP
用javascript获取textarea中的光标位置
2008/05/06 Javascript
判断脚本加载是否完成的方法
2009/05/26 Javascript
JavaScript DOM 学习第五章 表单简介
2010/02/19 Javascript
Extjs Ext.MessageBox.confirm 确认对话框详解
2010/04/02 Javascript
基于jQuery实现点击同时更改两个iframe的网址
2010/07/01 Javascript
jQuery的实现原理的模拟代码 -5 Ajax
2010/08/07 Javascript
浅析JavaScript中的类型和对象
2013/11/29 Javascript
两个多选select(multiple左右)添加、删除选项和取值实例
2014/05/12 Javascript
js实现的类似于asp数据字典的数据类型代码实例
2014/09/03 Javascript
AngularJS实现表单验证
2015/01/28 Javascript
使用console进行性能测试
2015/04/27 Javascript
jquery中$each()方法的使用指南
2015/04/30 Javascript
基于jquery实现人物头像跟随鼠标转动
2015/08/23 Javascript
JavaScript导航脚本判断当前导航
2016/07/12 Javascript
Bootstrap弹出框modal上层的输入框不能获得焦点问题的解决方法
2016/12/13 Javascript
微信小程序 免费SSL证书https、TLS版本问题的解决办法
2016/12/14 Javascript
Vue的elementUI实现自定义主题方法
2018/02/23 Javascript
前端axios下载excel文件(二进制)的处理方法
2018/07/31 Javascript
js删除数组中某几项的方法总结
2019/01/16 Javascript
为什么要使用Vuex的介绍
2019/01/19 Javascript
Linux下为不同版本python安装第三方库
2016/08/31 Python
Python中运算符&quot;==&quot;和&quot;is&quot;的详解
2016/10/08 Python
python机器学习理论与实战(五)支持向量机
2018/01/19 Python
python编写猜数字小游戏
2019/10/06 Python
Tensorflow tf.nn.depthwise_conv2d如何实现深度卷积的
2020/04/20 Python
Python并发请求下限制QPS(每秒查询率)的实现代码
2020/06/05 Python
python实现文件+参数发送request的实例代码
2021/01/05 Python
HTML5 表单验证失败的提示语问题
2017/07/13 HTML / CSS
员工自我鉴定
2013/10/09 职场文书
小学优秀班主任材料
2014/12/17 职场文书
个人更名证明
2015/06/23 职场文书
Go使用协程交替打印字符
2021/04/29 Golang
一次SQL如何查重及去重的实战记录
2022/03/13 MySQL
Java 垃圾回收超详细讲解记忆集和卡表
2022/04/08 Java/Android