js中的json对象详细介绍


Posted in Javascript onOctober 29, 2014

1.JSON(JavaScript Object Notation)一种简单的数据格式,比xml更轻巧。JSON是JavaScript原生格式,这意味着在JavaScript中处理JSON数据不需要任何特殊的API或工具包。
JSON的规则很简单:对象是一个无序的“‘名称:值'对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值'对”之间使用“,”(逗号)分隔。

规则如下:

1)映射用冒号(“:”)表示。名称:值
2)并列的数据之间用逗号(“,”)分隔。名称1:值1,名称2:值2
3) 映射的集合(对象)用大括号(“{}”)表示。{名称1:值1,名称2:值2}
4) 并列数据的集合(数组)用方括号(“[]”)表示。
[
{名称1:值,名称2:值2},

{名称1:值,名称2:值2}

]
5 )元素值可具有的类型:string, number, object, array, true, false, null

2.json中的五种写法:

1)传统方式存储数据,调用数据

<script type="text/javascript"> 

//JS传统方式下定义"类" 

function Person(id,name,age){ 

this.id = id; 

this.name = name; 

this.age = age; 

} 

//JS传统方式下创建"对象" 

var p = new Person(20141028,"一叶扁舟",22);
//调用类中的属性,显示该Person的信息 

window.alert(p.id); 

window.alert(p.name); 

window.alert(p.age); 

</script>

2)第一种样式:
<script type="text/javascript"> 

var person = { 

id:001, 

name:"一叶扁舟", 

age:23 

} 

window.alert("编号:"+person.id); 

window.alert("用户名:"+person.name); 

window.alert("年龄:"+person.age); 

</script>

3)第二种样式:
<script type="text/javascript"> 

var p = [ 

{id:001,name:"一叶扁舟",age:22}, 

{id:002,name:"无悔",age:23}, 

{id:003,name:"无悔_一叶扁舟",age:24} 

];
for(var i = 0; i < p.length; i++){ 

window.alert("编号:"+p[i].id); 

window.alert("用户名:"+p[i].name); 

window.alert("年龄:"+p[i].age);
} 

</script>

4)第三种样式:
<script type="text/javascript"> 

var p = { 

"province":[ 

{"city":"福州"}, 

{"city":"厦门"}, 

{"city":"莆田"} 

] 

}; 

window.alert("所在城市:" + p.province[0].city); 

</script>

5)第四种样式:
<script type="text/javascript"> 

var p = { 

"ids":[ 

{"id":001}, 

{"id":002}, 

{"id":003} 

], 

"names":[ 

{"name":"一叶扁舟"}, 

{"name":"无悔"}, 

{"name":"无悔_一叶扁舟"} 

] 

};
for(var i = 0; i < p.names.length; i++){ 

window.alert("名字:"+p.names[i].name);
} 

for(var i = 0; i < p.ids.length; i++){ 

window.alert("id:"+p.ids[i].id); 

}
</script>

6)第五种样式:
<script type="text/javascript"> 

var p = { 

"province":["福州","厦门","莆田"] 

}; 

window.alert("城市的个数:"+p.province.length); 

window.alert("分别是:\n"); 

for(var i=0;i<p.province.length;i++){ 

window.alert(p.province[i]); 

} 

</script>
Javascript 相关文章推荐
LBS blog sql注射漏洞[All version]-官方已有补丁
Aug 26 Javascript
javascript或asp实现的判断身份证号码是否正确两种验证方法
Nov 26 Javascript
jQuery的写法不同导致的兼容性问题的解决方法
Jul 29 Javascript
JavaScript高级程序设计(第3版)学习笔记5 js语句
Oct 11 Javascript
键盘KeyCode值列表汇总
Nov 26 Javascript
js实现网页标题栏闪烁提示效果实例分析
Nov 20 Javascript
javascript实现全角与半角字符的转换
Jan 07 Javascript
利用JS对iframe父子(内外)页面进行操作的方法教程
Jun 15 Javascript
vue移动端下拉刷新和上拉加载的实现代码
Sep 08 Javascript
Intellij IDEA搭建vue-cli项目的方法步骤
Oct 20 Javascript
详解vue几种主动刷新的方法总结
Feb 19 Javascript
深入了解JavaScript 防抖和节流
Sep 12 Javascript
鼠标悬浮显示二级菜单效果的jquery实现
Oct 29 #Javascript
BAT及各大互联网公司2014前端笔试面试题--JavaScript篇
Oct 29 #Javascript
JavaScript中的迭代器和生成器详解
Oct 29 #Javascript
JS实现倒计时和文字滚动的效果实例
Oct 29 #Javascript
javascript设置连续两次点击按钮时间间隔的方法
Oct 28 #Javascript
jQuery中parents()和parent()的区别分析
Oct 28 #Javascript
原生javascript实现获取指定元素下所有后代元素的方法
Oct 28 #Javascript
You might like
用php实现像JSP,ASP里Application那样的全局变量
2007/01/12 PHP
PHP 文件缓存的性能测试
2010/04/25 PHP
用php随机生成福彩双色球号码的2种方法
2013/02/04 PHP
深入分析php之面向对象
2013/05/15 PHP
php自定义函数截取汉字长度
2014/05/15 PHP
帝国CMS留言板回复后发送EMAIL通知客户
2015/07/06 PHP
Adnroid 微信内置浏览器清除缓存
2016/07/11 PHP
PHP性能分析工具xhprof的安装使用与注意事项
2017/12/19 PHP
PHP PDOStatement::getColumnMeta讲解
2019/02/01 PHP
parseInt parseFloat js字符串转换数字
2010/08/01 Javascript
javascript一些实用技巧小结
2011/03/18 Javascript
jquery移动listbox的值原理及代码
2013/05/03 Javascript
jQuery实现的导航下拉菜单效果
2016/07/04 Javascript
vue中页面跳转拦截器的实现方法
2017/08/23 Javascript
jquery animate动画持续运动的实例
2017/11/29 jQuery
javascript中的隐式调用
2018/02/10 Javascript
JavaScript类的继承方法小结【组合继承分析】
2018/07/11 Javascript
轻量级富文本编辑器wangEditor结合vue使用方法示例
2018/10/10 Javascript
JS使用栈判断给定字符串是否是回文算法示例
2019/03/04 Javascript
python中__call__内置函数用法实例
2015/06/04 Python
python 找出list中最大或者最小几个数的索引方法
2018/10/30 Python
pycharm激活码有效到2020年11月底
2020/09/18 Python
Python和Anaconda和Pycharm安装教程图文详解
2020/02/04 Python
Python Tornado批量上传图片并显示功能
2020/03/26 Python
pandas 强制类型转换 df.astype实例
2020/04/09 Python
利用CSS3实现的文字定时向上滚动
2016/08/29 HTML / CSS
HTML5新增加标签和功能概述
2016/09/05 HTML / CSS
车间调度岗位职责
2013/11/30 职场文书
运动会广播稿20字
2014/02/18 职场文书
读书演讲主持词
2014/03/18 职场文书
大学生精神文明先进个人事迹材料
2014/05/02 职场文书
广播体操比赛口号
2014/06/10 职场文书
万能检讨书
2015/01/27 职场文书
MySQL分库分表与分区的入门指南
2021/04/22 MySQL
go类型转换及与C的类型转换方式
2021/05/05 Golang
一文解答什么是MySQL的回表
2022/08/05 MySQL