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 相关文章推荐
Convert Seconds To Hours
Jun 16 Javascript
javascript 精粹笔记
May 09 Javascript
javascript分页代码实例分享(js分页)
Dec 13 Javascript
jquery 中ajax执行的优先级
Jun 22 Javascript
javascript结合Flexbox简单实现滑动拼图游戏
Feb 18 Javascript
react-router4 配合webpack require.ensure 实现异步加载的示例
Jan 18 Javascript
node中使用es6/7/8(支持性与性能)
Mar 28 Javascript
html-webpack-plugin修改页面的title的方法
Jun 18 Javascript
vue 修改 data 数据问题并实时显示操作
Sep 07 Javascript
vue3为什么要用proxy替代defineProperty
Oct 19 Javascript
Vue自定义表单内容检查rules实例
Oct 30 Javascript
js实现纯前端压缩图片
Nov 16 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生成EXCEL的东东
2006/10/09 PHP
第十三节--对象串行化
2006/11/16 PHP
在PHP上显示JFreechart画的统计图方法
2013/11/03 PHP
PHP合并数组+号和array_merge的区别
2015/06/25 PHP
php模板引擎技术简单实现
2016/03/15 PHP
Laravel框架路由设置与使用示例
2018/06/12 PHP
Javascript &amp; DHTML 实例编程(教程)DOM基础和基本API
2007/06/02 Javascript
使用JS进行目录上传(相当于批量上传)
2010/12/05 Javascript
基于JQuery实现仿网易邮箱全屏动感滚动插件fullPage
2015/09/20 Javascript
jQuery学习笔记之入门
2016/12/14 Javascript
Angular实现跨域(搜索框的下拉列表)
2017/02/16 Javascript
浅谈Vue.js 1.x 和 2.x 实例的生命周期
2017/07/25 Javascript
Angularjs实现上传图片预览功能
2017/09/01 Javascript
原生js实现省市区三级联动代码分享
2018/02/12 Javascript
深入剖析Node.js cluster模块
2018/05/23 Javascript
jQuery实现表单动态添加与删除数据操作示例
2018/07/03 jQuery
jQuery中ajax请求后台返回json数据并渲染HTML的方法
2018/08/08 jQuery
NodeJS如何实现同步的方法示例
2018/08/24 NodeJs
vue实现微信分享链接添加动态参数的方法
2019/04/29 Javascript
express框架中使用jwt实现验证的方法
2019/08/25 Javascript
[01:51]2014DOTA2国际邀请赛 这个赛场没有失败者VGTi5再见
2014/07/23 DOTA
[07:48]DOTA2上海特级锦标赛主赛事首日RECAP
2016/03/04 DOTA
[49:58]完美世界DOTA2联赛PWL S3 Magma vs DLG 第一场 12.18
2020/12/19 DOTA
Python中实现对Timestamp和Datetime及UTC时间之间的转换
2015/04/08 Python
python 字典中取值的两种方法小结
2018/08/02 Python
python科学计算之scipy——optimize用法
2019/11/25 Python
美国折扣地毯销售网站:Rugs.com
2020/03/27 全球购物
小学班级口号
2014/06/09 职场文书
纪念一二九运动演讲稿
2014/09/16 职场文书
民主生活会汇报材料
2014/12/15 职场文书
四年级学生期末评语
2014/12/26 职场文书
2015年幼儿教师个人工作总结
2015/05/20 职场文书
竞聘开场白方式有哪些?
2019/08/28 职场文书
Golang: 内建容器的用法
2021/05/05 Golang
关于@OnetoMany关系映射的排序问题,使用注解@OrderBy
2021/12/06 Java/Android
Win10鼠标轨迹怎么开 Win10显示鼠标轨迹方法
2022/04/06 数码科技