json2.js的初步学习与了解


Posted in Javascript onOctober 06, 2011

json2.js的初步学习与了解
1.)该js的下载地址是:http://www.json.org/json2.js
2.)在页面中引用该脚本:<script type="text/javascript" src="js/json2.js"></script>
3.)示例演示一:

//直接声明json数据结构 
var myJSONObject = {"bindings": [ 
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"}, 
{"ircEvent": "PRIVMSG", "method": "deleteURI", "regex": "^delete.*"}, 
{"ircEvent": "PRIVMSG", "method": "randomURI", "regex": "^random.*"} 
] 
};

这个例子中,创建了一个对象,它只包含一个成员“bindings”。“bindings”是一个包含了3个对象的数组,而这每个对象都有"ircEvent"、"method"和"regex"3个成员。
这些成员可以用“.”或subscript 操作得到。
如:myJSONObject.bindings[0].method // "newURI"
myJSONObject.bindings[1].deleteURI // "newURI"
//声明字符串,可对比一下json文本与我们正常文本的区别
var normalstring='[{persons:[{name:"jordan",sex:"m",age:"40"}, {name:"bryant",sex:"m",age:"28"}, {name:"McGrady",sex:"m",age:"27"} ]}]';
var jsontext='[{"persons":[{"name":"jordan","sex":"m","age":"40"}, {"name":"bryant","sex":"m","age":"28"}, {"name":"McGrady","sex":"m","age":"27"} ]}]';
我们可以使用eval()函数调用JavaScript的编译器把JSON文本转变成对象。因为JSON是JavaScript的一个确切的子集,编译器可以正确地解析JSON文本,然后生成一个对象结构。
//调用eval函数转换为json对象,
var myE = eval(normalstring);
//将json对象转换为字符串
var text = JSON.stringify(myE);
//对比转换后的json文本与声明的文本区别
document.writeln('转换后的json文本:'+text+'<br><br>声明的json格式文本 '+jsontext+'<br><br>声明的普通格式文本 '+normalstring+'<br><br>');
结果如下:
转换后的json文本:[{"persons":[{"name":"jordan","sex":"m","age":"40"},{"name":"bryant","sex":"m","age":"28"},{"name":"McGrady","sex":"m","age":"27"}]}]
声明的json格式文本 [{"persons":[{"name":"jordan","sex":"m","age":"40"},{"name":"bryant","sex":"m","age":"28"},{"name":"McGrady","sex":"m","age":"27"}]}]
声明的普通格式文本 [{persons:[{name:"jordan",sex:"m",age:"40"}, {name:"bryant",sex:"m",age:"28"}, {name:"McGrady",sex:"m",age:"27"} ]}]
小结:转换后的json文本和声明的json格式文本内容是相同的。
//当安全比较重要的时候使用JSON解析就好一些。JSON解析只会识别JSON文本并且它更安全,下面调用json的parse函数对文本数据转换生成json数据结构
var myData = JSON.parse(jsontext);
完整的文件如下(区别:myJSONObject,jsontext,normalstring的不同):
<%@ page language="java" pageEncoding="UTF-8"%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<script type="text/javascript" src="js/json2.js"></script> 
</head> 
<body> 
<script> 
var normalstring='[{persons:[{name:"jordan",sex:"m",age:"40"}, {name:"bryant",sex:"m",age:"28"}, {name:"McGrady",sex:"m",age:"27"} ]}]'; 
var jsontext='[{"persons":[{"name":"jordan","sex":"m","age":"40"}, {"name":"bryant","sex":"m","age":"28"}, {"name":"McGrady","sex":"m","age":"27"} ]}]'; 
var myJSONObject = {"bindings": [ 
{"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"}, 
{"ircEvent": "PRIVMSG", "method": "deleteURI", "regex": "^delete.*"}, 
{"ircEvent": "PRIVMSG", "method": "randomURI", "regex": "^random.*"} 
] 
}; 
//调用eval函数转换为json对象, 
var myE = eval(normalstring); 
//将json对象转换为字符串 
var text = JSON.stringify(myE); 
//对比转换后的json文本与声明的文本区别 
document.writeln('转换后的json文本:'+text+'<br><br>声明的json格式文本 '+jsontext+'<br><br>声明的普通格式文本 '+normalstring+'<br><br>'); 
//JSON解析 
var myData = JSON.parse(jsontext); 
</script> 
</body> 
</html>

4.)示例演示二:
//下面是对json对象的增删查改操作 
<%@ page language="java" pageEncoding="UTF-8"%> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<script type="text/javascript" src="js/json2.js"></script> 
</head> 
<body> 
<script> 
//声明json对象 
var jsonObj2={persons:[ 
{name:"jordan",sex:"m",age:"40"}, 
{name:"bryant",sex:"m",age:"28"}, 
{name:"McGrady",sex:"m",age:"27"} 
]}; 
var persons=jsonObj2.persons; 
var str=""; 
var person={name:"yaoMing",sex:"m",age:"26"}; 
//以下为json对象的操作,去掉注释可以查看操作结果 
jsonObj2.persons.push(person);//数组最后加一条记录 
jsonObj2.persons.pop();//删除最后一项 
jsonObj2.persons.shift();//删除第一项 
jsonObj2.persons.unshift(person);//数组最前面加一条记录 只要适合Javascript的方法都是可以用在JSON对象的数组中的!所以还有另外的方法splice( )进行crud操作! //删除 
jsonObj2.persons.splice(0,2);//开始位置,删除个数 
//替换不删除 
var self={name:"tom",sex:"m",age:"24"}; 
var brother={name:"Mike",sex:"m",age:"29"}; 
jsonObj2.persons.splice(1,0,self,brother,self);//开始位置,删除个数,插入对象 
//替换并删除 
jsonObj2.persons.splice(0,1,self,brother);//开始位置,删除个数,插入对象 
for(var i=0;i<persons.length;i++){ 
var cur_person=persons[i]; 
str+=cur_person.name+"'sex is "+cur_person.sex+" and age is "+cur_person.age+"<br><br>"; 
} 
document.writeln(str); 
//转换为json文本 
var myjsonobj = JSON.stringify(jsonObj2); 
document.writeln(myjsonobj); 
document.writeln(persons.length); 
</script> 
</body> 
</html>
Javascript 相关文章推荐
JS脚本defer的作用示例介绍
Jan 02 Javascript
简述JavaScript对传统文档对象模型的支持
Jun 16 Javascript
Jquery幻灯片特效代码分享--打开页面随机选择切换方式(3)
Aug 15 Javascript
AngularJS基础 ng-cloak 指令简单示例
Aug 01 Javascript
利用Angularjs实现幻灯片效果
Sep 07 Javascript
Vue.set()实现数据动态响应的方法
Feb 07 Javascript
在vue中使用css modules替代scroped的方法
Mar 10 Javascript
浅谈Postman解决token传参的问题
Mar 31 Javascript
关于自定义Egg.js的请求级别日志详解
Dec 12 Javascript
Vue结合后台导入导出Excel问题详解
Feb 19 Javascript
elementUI多选框反选的实现代码
Apr 03 Javascript
浅谈Vue为什么不能检测数组变动
Oct 14 Javascript
弹出层之1:JQuery.Boxy (一) 使用介绍
Oct 06 #Javascript
event.X和event.clientX的区别分析
Oct 06 #Javascript
jQuery EasyUI API 中文文档 - MenuButton菜单按钮使用介绍
Oct 06 #Javascript
jQuery EasyUI API 中文文档 - Form表单
Oct 06 #Javascript
基于jQuery的模仿新浪微博时间的组件
Oct 04 #Javascript
JavaScript 匿名函数(anonymous function)与闭包(closure)
Oct 04 #Javascript
通过JavaScript控制字体大小的代码
Oct 04 #Javascript
You might like
分页显示Oracle数据库记录的类之一
2006/10/09 PHP
WordPress主题制作中自定义头部的相关PHP函数解析
2016/01/08 PHP
常用一些Javascript判断函数
2012/08/14 Javascript
如何使用Jquery获取Form表单中被选中的radio值
2013/08/09 Javascript
只需一行代码,轻松实现一个在线编辑器
2013/11/12 Javascript
js实现具有高亮显示效果的多级菜单代码
2015/09/01 Javascript
JavaScript DOM 学习总结(五)
2015/11/24 Javascript
jquery自定义右键菜单、全选、不连续选择
2016/03/01 Javascript
轻松理解Javascript变量的相关问题
2017/01/20 Javascript
3分钟掌握常用的JS操作JSON方法总结
2017/04/25 Javascript
JavaScript中数组常见操作技巧
2017/09/01 Javascript
webpack打包并将文件加载到指定的位置方法
2018/02/22 Javascript
JS常见构造模式实例对比分析
2018/08/27 Javascript
Angular动态绑定样式及改变UI框架样式的方法小结
2018/09/03 Javascript
vue动态循环出的多个select出现过的变为disabled(实例代码)
2019/11/10 Javascript
python类和继承用法实例
2015/07/07 Python
Python3.6安装及引入Requests库的实现方法
2018/01/24 Python
Django项目中包含多个应用时对url的配置方法
2018/05/30 Python
WIn10+Anaconda环境下安装PyTorch(避坑指南)
2019/01/30 Python
详解Python3序列赋值、序列解包
2019/05/14 Python
树莓派+摄像头实现对移动物体的检测
2019/06/22 Python
python常用排序算法的实现代码
2019/11/08 Python
python系统指定文件的查找只输出目录下所有文件及文件夹
2020/01/19 Python
Python新手学习标准库模块命名
2020/05/29 Python
想学画画?python满足你!
2020/12/24 Python
京东全球售:直邮香港,澳门,台湾,美国,澳大利亚等地区
2017/09/24 全球购物
亚洲最大的运动鞋寄售店:KicksCrew
2020/11/26 全球购物
介绍一下Linux中的链接
2016/05/28 面试题
《争吵》教学反思
2014/02/15 职场文书
运输企业安全生产责任书
2014/07/28 职场文书
海洋科学专业求职信
2014/08/10 职场文书
综合实践活动报告
2015/02/05 职场文书
2015年度工程师评职称工作总结
2015/10/14 职场文书
导游词之烟台威海蓬莱
2019/11/14 职场文书
Django基础CBV装饰器和中间件
2022/03/22 Python
浅谈音视频 pts dts基本概念及理解
2022/08/05 数码科技