JavaScript中的对象与JSON


Posted in Javascript onJuly 03, 2015

简介

JSON即JavaScript Object Natation,它是一种轻量级的数据交换格式,非常适合于服务器与 JavaScript 的交互。
JSON是一种数据交换格式,像XML和YAML一样是一种在各种不同语言间传递结构化信息的方式。从另一方面来说,javascript对象是javascript语言中的一种数据类型,就像PHP中的数组、C++中类和结构体。

定义JSON与javascript对象

在javascript程序中定义对象的时候,对象的属性名可以加双引号也可以不加双引号。如果属性名包含特殊字符(如!、if等)的时候,就必须加双引号。
在定义JSON的时候,属性名必须加双引号。

代码示例:

1.定义javascript对象

var obj={name:"tudouya","sex":"man"};  #两个属性可以加双引号也可以不加

var obj={"!":"hello world"};  #属性名包含特殊字符时必须加双引号

2.定义JSON字符串
var jsonString={"name":"tudouya"};  #定义JSON时必须加双引号

javascript对象转换为JSON

1.javascript对象转换为JSON

我们可以使用javascript的内置函数将javascript对象转换为JSON,这个函数就是JSON.stringify().
代码示例:

var obj={name:"tudouya",sex:"man"};

var jsonObj=JSON.stringify(obj);

console.log(jsonObj);

##输出结果为:{"name":"tudouya","sex":"man"}

在将javascript对象转换为JSON的时候,有一点是需要我们注意的:
如果对象中包含有值为函数和日期的属性,JSON会忽略值为函数的属性,并将值为日期的属性转换为字符串。
代码示例:
var obj={

 name:"tudouya",

 birthday:new Date(),

 action:function (){

  document.write("walk");

 }

};

var jsonObj=JSON.stringify(obj);

console.log(jsonObj);

##输出结果为:{"name":"tudouya","birthday":"2014-08-12T10:05:00.497Z"}

javascript中解析JSON

在老版本的JS中,大家通常都使用eval()函数来解析JSON,但是ECMAScript5给我们提供了一个解析JSON的新函数JSON.parse()。

这个函数的使用方法比较简单,大家可以自行尝试。当对某个JSON字符串应用该函数以后,该JSON就被转换为javascript的对象,也就是说当用typeof运算符查看该函数的类型时,返回的值是Object。
同样有一点需要注意的是,该函数是ECMAScript5以后才支持的,如果是旧版本的浏览器那么可能不支持该函数。解决的方法是加载一个实现该函数的js文件,即json2.js。如果使用的是JQuery框架,jQuery.parseJSON(),该函数调用了JSON.parse()方法。
关于使用eval()方法解析JSON,这个等深入学习后会记录下来。

一个很重要的概念

作为一个前端菜鸟,经常听到别人说“JSON对象”,但是其实并没有“JSON对象”这个概念,JSON真正的表现形式是字符串。

Javascript 相关文章推荐
一实用的实现table排序的Javascript类库
Sep 12 Javascript
JavaScript 解析读取XML文档 实例代码
Jul 07 Javascript
JQuery的read函数与js的onload不同方式实现
Mar 18 Javascript
js固定DIV高度,超出部分自动添加滚动条的简单方法
Jul 10 Javascript
JavaScript控制两个列表框listbox左右交换数据的方法
Mar 18 Javascript
浅谈jQuery中的事件
Mar 23 Javascript
jQuery替换textarea中换行的方法
Jun 10 Javascript
基于jquery实现鼠标滚轮驱动的图片切换效果
Oct 26 Javascript
javascript实现下雨效果
Mar 27 Javascript
AngularJS实现图片上传和预览功能的方法分析
Nov 08 Javascript
javascript事件循环event loop的简单模型解释与应用分析
Mar 14 Javascript
浅谈javascript事件环微任务和宏任务队列原理
Sep 12 Javascript
javascript生成大小写字母
Jul 03 #Javascript
jQuery切换所有复选框选中状态的方法
Jul 02 #Javascript
javascript带回调函数的异步脚本载入方法实例分析
Jul 02 #Javascript
javascript 闭包详解
Jul 02 #Javascript
JavaScript实现点击自动选择TextArea文本的方法
Jul 02 #Javascript
浅谈Javascript线程及定时机制
Jul 02 #Javascript
JavaScript获得url查询参数的方法
Jul 02 #Javascript
You might like
探讨PHP函数ip2long转换IP时数值太大产生负数的解决方法
2013/06/06 PHP
PHP编写RESTful接口
2016/02/23 PHP
浅谈PHP的反射机制
2016/12/15 PHP
[转]JS宝典学习笔记
2007/02/07 Javascript
权威JavaScript 中的内存泄露模式
2007/08/13 Javascript
JS request函数 用来获取url参数
2010/05/17 Javascript
js中字符替换函数String.replace()使用技巧
2011/08/14 Javascript
深入理解javascript作用域和闭包
2014/09/23 Javascript
JQuery入门基础小实例(1)
2015/09/17 Javascript
jquery编写日期选择器
2017/03/16 Javascript
jq.ajax+php+mysql实现关键字模糊查询(示例讲解)
2018/01/02 Javascript
vue中手机号,邮箱正则验证以及60s发送验证码的实例
2018/03/16 Javascript
vue 组件高级用法实例详解
2018/04/11 Javascript
Node.js 使用jade模板引擎的示例
2018/05/11 Javascript
JavaScript实用代码小技巧
2018/08/23 Javascript
python可视化实现代码
2019/01/15 Python
python使用Pandas库提升项目的运行速度过程详解
2019/07/12 Python
详解python程序中的多任务
2020/09/16 Python
Python中的特殊方法以及应用详解
2020/09/20 Python
pycharm + django跨域无提示的解决方法
2020/12/06 Python
Appium+Python实现简单的自动化登录测试的实现
2021/01/26 Python
python利用proxybroker构建爬虫免费IP代理池的实现
2021/02/21 Python
css3背景图片透明叠加属性cross-fade简介及用法实例
2013/01/08 HTML / CSS
CSS3中的@keyframes关键帧动画的选择器绑定
2016/06/13 HTML / CSS
英国网上电器商店:Electricshop
2020/03/15 全球购物
下面关于"联合"的题目的输出是什么
2013/08/06 面试题
个人简历中自我评价
2014/02/11 职场文书
2014年小学植树节活动方案
2014/03/02 职场文书
益达广告词
2014/03/14 职场文书
2015年世界急救日宣传活动方案
2015/05/06 职场文书
保险公司反洗钱宣传活动总结
2015/05/08 职场文书
2015年安全生产月工作总结
2015/07/27 职场文书
《狼牙山五壮士》教学反思
2016/02/17 职场文书
详解Python小数据池和代码块缓存机制
2021/04/07 Python
Python中常见的反爬机制及其破解方法总结
2021/06/10 Python
Python使用MapReduce进行简单的销售统计
2022/04/22 Python