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 相关文章推荐
调用innerHTML之后onclick失效问题的解决方法
Jan 28 Javascript
Highcharts学习之坐标轴
Aug 02 Javascript
从0开始学Vue
Oct 27 Javascript
AngularJs基于角色的前端访问控制的实现
Nov 07 Javascript
jquery 手势密码插件
Mar 17 Javascript
js实现多行文本框统计剩余字数功能
Mar 28 Javascript
详解vue-router2.0动态路由获取参数
Jun 14 Javascript
vue之数据交互实例代码
Jun 20 Javascript
代码详解javascript模块加载器
Mar 04 Javascript
Vue表单类的父子组件数据传递示例
May 03 Javascript
解决vue中监听input只能输入数字及英文或者其他情况的问题
Aug 30 Javascript
vue Element左侧无限级菜单实现
Jun 10 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
兼容性比较好的PHP生成缩略图的代码
2011/01/12 PHP
解析php如何将日志写进syslog
2013/06/28 PHP
php学习笔记之基础知识
2014/11/08 PHP
PHP中的使用curl发送请求(GET请求和POST请求)
2017/02/08 PHP
[原创]PHP正则删除html代码中a标签并保留标签内容的方法
2017/05/23 PHP
javascript 复杂的嵌套环境中输出单引号和双引号
2009/05/26 Javascript
js 控制图片大小核心讲解
2013/10/09 Javascript
jQuery 追加元素的方法如append、prepend、before
2014/01/16 Javascript
Javascript调用函数方法的几种方式介绍
2015/03/20 Javascript
详细分析Javascript中创建对象的四种方式
2016/08/17 Javascript
jQuery.Ajax()的data参数类型详解
2017/07/23 jQuery
使用Vue开发一个实时性时间转换指令
2018/01/17 Javascript
vue form 表单提交后刷新页面的方法
2018/09/04 Javascript
详解小程序循环require之坑
2019/03/08 Javascript
jquery简单实现纵向的无缝滚动代码实例
2019/04/01 jQuery
如何封装Vue Element的table表格组件
2021/02/06 Vue.js
[04:22]DOTA2大事件之护国神翼
2020/08/14 DOTA
在Django的视图(View)外使用Session的方法
2015/07/23 Python
Python 使用SMTP发送邮件的代码小结
2016/09/21 Python
[原创]Python入门教程5. 字典基本操作【定义、运算、常用函数】
2018/11/01 Python
Python格式化字符串f-string概览(小结)
2019/06/18 Python
Python中面向对象你应该知道的一下知识
2019/07/10 Python
关于django 1.10 CSRF验证失败的解决方法
2019/08/31 Python
Python+OpenCV实现图像的全景拼接
2020/03/05 Python
python集合能干吗
2020/07/19 Python
HTML5实现表单自动验证功能实例代码
2017/01/11 HTML / CSS
7 For All Mankind官网:美国加州洛杉矶的高级牛仔服装品牌
2018/12/20 全球购物
了解AppleShare protocol(AppleShare协议)吗
2015/08/28 面试题
shell程序中如何注释
2012/01/28 面试题
大学生创业计划书的用途
2014/01/08 职场文书
学历公证书范本
2014/04/09 职场文书
爱我中华教学反思
2014/04/28 职场文书
财务个人年度总结范文
2015/02/26 职场文书
感恩父母主题班会
2015/08/12 职场文书
mysql获取指定时间段中所有日期或月份的语句(不设存储过程,不加表)
2021/06/18 MySQL
如何利用python实现列表嵌套字典取值
2022/06/10 Python