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 相关文章推荐
深入领悟JavaScript中的面向对象
Nov 18 Javascript
jQuery 无限级菜单的简单实例
Feb 21 Javascript
JS响应鼠标点击实现两个滑块区间拖动效果
Oct 26 Javascript
jQuery移动web开发中的页面初始化与加载事件
Dec 03 Javascript
js精准的倒计时函数分享
Jun 29 Javascript
js完整倒计时代码分享
Sep 18 Javascript
AngularJS执行流程详解
Feb 17 Javascript
javascript DOM的详解及实例代码
Mar 06 Javascript
layui实现数据分页功能
Jul 27 Javascript
细述Javascript的加法运算符的具体使用
Oct 18 Javascript
Vue.js自定义指令学习使用详解
Oct 19 Javascript
vue-cli设置publicPath小记
Apr 14 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 nl2br函数 将换行字符转成 &amp;lt;br&amp;gt;
2009/08/21 PHP
php中time()和mktime()方法的区别
2013/09/28 PHP
ThinkPHP验证码使用简明教程
2014/03/05 PHP
ThinkPHP中Session用法详解
2014/11/29 PHP
PHP输入流php://input实例讲解
2015/12/22 PHP
PHP cookie与session会话基本用法实例分析
2019/11/18 PHP
Prototype使用指南之base.js
2007/01/10 Javascript
jQuery实现用户注册的表单验证示例
2013/08/28 Javascript
jQuery实现TAB风格的全国省份城市滑动切换效果代码
2015/08/24 Javascript
vue.js实现仿原生ios时间选择组件实例代码
2016/12/21 Javascript
前端主流框架vue学习笔记第一篇
2017/07/26 Javascript
VUE页面中加载外部HTML的示例代码
2017/09/20 Javascript
Vue 项目代理设置的优化
2018/04/17 Javascript
基于vue,vue-router, vuex及addRoutes进行权限控制问题
2018/05/02 Javascript
详解mpvue中小程序自定义导航组件开发指南
2019/02/11 Javascript
vue v-for循环重复数据无法添加问题解决方法【加track-by='索引'】
2019/03/15 Javascript
vue中使用element ui的弹窗与echarts之间的问题详解
2019/10/25 Javascript
python中的函数用法入门教程
2014/09/02 Python
Python列表append和+的区别浅析
2015/02/02 Python
python实现支持目录FTP上传下载文件的方法
2015/06/03 Python
解决django前后端分离csrf验证的问题
2019/02/03 Python
python二维键值数组生成转json的例子
2019/12/06 Python
Python模块future用法原理详解
2020/01/20 Python
浅谈python3 构造函数和析构函数
2020/03/12 Python
Python 实现将numpy中的nan和inf,nan替换成对应的均值
2020/06/08 Python
python中HTMLParser模块知识点总结
2021/01/25 Python
C#如何判断当前用户是否输入某个域
2015/12/07 面试题
通信工程毕业生求职信
2013/11/16 职场文书
音乐学个人的自荐书范文
2013/11/26 职场文书
活动总结模板
2014/05/09 职场文书
求职信结尾怎么写
2014/05/26 职场文书
运动会开幕式新闻稿
2015/07/17 职场文书
redis实现共同好友的思路详解
2021/05/26 Redis
业余无线电通联Q语
2022/02/18 无线电
MySQL 原理与优化之Limit 查询优化
2022/08/14 MySQL
Golang Web 框架Iris安装部署
2022/08/14 Python