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 相关文章推荐
深入理解JavaScript系列(6) 强大的原型和原型链
Jan 15 Javascript
JavaScript实现拼音排序的方法
Nov 20 Javascript
点击隐藏页面左栏或右栏实现js代码
Apr 01 Javascript
Node.js中的模块机制学习笔记
Nov 04 Javascript
bootstrap laydate日期组件使用详解
Jan 04 Javascript
Require.JS中的几种define定义方式示例
Jun 01 Javascript
微信小程序 地图map实例详解
Jun 07 Javascript
jQuery+ajax实现修改密码验证功能实例详解
Jul 06 jQuery
vue 简单自动补全的输入框的示例
Mar 12 Javascript
JavaScript设计模式之责任链模式实例分析
Jan 16 Javascript
Angular7.2.7路由使用初体验
Mar 01 Javascript
DWR内存兼容及无法调用问题解决方案
Oct 16 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判断所处服务器操作系统的类型
2013/06/20 PHP
关于Sphinx创建全文检索的索引介绍
2013/06/25 PHP
在PHP中输出JS语句以及乱码问题的解决方案
2019/02/13 PHP
Laravel框架FormRequest中重写错误处理的方法
2019/02/18 PHP
一个基于jquery的文本框记数器
2012/09/19 Javascript
javascript使用中为什么10..toString()正常而10.toString()出错呢
2013/01/11 Javascript
js去除输入框中所有的空格和禁止输入空格的方法
2014/06/09 Javascript
常用jQuery选择器总结
2014/07/11 Javascript
JavaScript中的Number数字类型学习笔记
2016/05/26 Javascript
js剪切板应用clipboardData实例解析
2016/05/29 Javascript
jQuery+ajax简单实现文件上传的方法
2016/06/03 Javascript
Javascript中的arguments对象
2016/06/20 Javascript
vue中eventbus被多次触发以及踩过的坑
2017/12/02 Javascript
详解Nodejs内存治理
2018/05/13 NodeJs
原生JS实现$.param() 函数的方法
2018/08/10 Javascript
用Object.prototype.toString.call(obj)检测对象类型原因分析
2018/10/11 Javascript
Vue两个版本的区别和使用方法(更深层次了解)
2020/02/16 Javascript
小程序实现图片移动缩放效果
2020/05/26 Javascript
JavaScript实现鼠标经过表格某行时此行变色
2020/11/20 Javascript
Python爬虫框架Scrapy实战之批量抓取招聘信息
2015/08/07 Python
Python编程中实现迭代器的一些技巧小结
2016/06/21 Python
利用Python代码实现数据可视化的5种方法详解
2018/03/25 Python
pandas多级分组实现排序的方法
2018/04/20 Python
python实现操作文件(文件夹)
2019/10/31 Python
matplotlib.pyplot画图并导出保存的实例
2019/12/07 Python
Python批量删除mysql中千万级大量数据的脚本分享
2020/12/03 Python
一款利用纯css3实现的360度翻转按钮的实例教程
2014/11/05 HTML / CSS
canvas绘制文本内容自动换行的实现代码
2019/01/14 HTML / CSS
土耳其国际性时尚购物网站:Modanisa
2018/01/19 全球购物
Python里面如何实现tuple和list的转换
2012/06/13 面试题
中学教师自我鉴定
2014/02/07 职场文书
学生安全责任书范本
2014/07/24 职场文书
乡领导班子四风问题对照检查材料
2014/09/25 职场文书
外科护士长工作总结
2015/08/12 职场文书
小程序实现文字循环滚动动画
2021/06/14 Javascript
MySQL数据库Innodb 引擎实现mvcc锁
2022/05/06 MySQL