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实现的完美渐变弹出层效果代码
Apr 02 Javascript
JavaScript 对象链式操作测试代码
Apr 25 Javascript
用Javascript评估用户输入密码的强度实现代码
Nov 30 Javascript
JS特殊函数(Function()构造函数、函数直接量)区别介绍
May 19 Javascript
JS实现随机数生成算法示例代码
Aug 08 Javascript
原生js操作checkbox用document.getElementById实现
Oct 12 Javascript
javascript验证身份证号
Mar 03 Javascript
javascript实现类似百度分享功能的方法
Jul 27 Javascript
js 自带的 map() 方法全面了解
Aug 16 Javascript
BootStrap实现带有增删改查功能的表格(DEMO详解)
Oct 26 Javascript
jQuery序列化后的表单值转换成Json
Jun 16 jQuery
微信小程序之批量上传并压缩图片的实例代码
Jul 05 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
全国FM电台频率大全 - 20 广西省
2020/03/11 无线电
比特率,大家看看这个就不用收音机音质去比MP3音质了
2021/03/01 无线电
QueryPath PHP 中的jQuery
2010/04/11 PHP
php 大数据量及海量数据处理算法总结
2011/05/07 PHP
PHP无法访问远程mysql的问题分析及解决
2013/05/16 PHP
PHP中使用localhost连接Mysql不成功的解决方法
2014/08/20 PHP
CodeIgniter分页类pagination使用方法示例
2016/03/28 PHP
实例讲解PHP表单处理
2019/02/15 PHP
thinkphp5.1框架容器与依赖注入实例分析
2019/07/23 PHP
浅谈laravel-admin的sortable和orderby使用问题
2019/10/03 PHP
一个收集图片的bookmarlet(js 刷新页面中的图片)
2010/05/27 Javascript
js bind 函数 使用闭包保存执行上下文
2011/12/26 Javascript
商城常用滚动的焦点图效果代码简单实用
2013/03/28 Javascript
JS判断日期格式是否合法的简单实例
2016/07/11 Javascript
利用Angularjs实现幻灯片效果
2016/09/07 Javascript
AngularJS 单元测试(一)详解
2016/09/21 Javascript
详解Layer弹出层样式
2017/08/21 Javascript
canvas基础绘制-绚丽倒计时的实例
2017/09/17 Javascript
基于vue2实现上拉加载功能
2017/11/28 Javascript
JS实现将链接生成二维码并转为图片的方法
2018/03/17 Javascript
vue做移动端适配最佳解决方案(亲测有效)
2018/09/04 Javascript
微信小程序实现图片上传
2019/05/23 Javascript
python 用opencv实现霍夫线变换
2020/11/27 Python
IE滤镜与CSS3效果(详细整理分享)
2013/01/25 HTML / CSS
html5 Canvas画图教程(4)—未闭合的路径及渐变色的填充方法
2013/01/09 HTML / CSS
Daniel Wellington官方海外旗舰店:丹尼尔惠灵顿DW手表
2018/02/22 全球购物
耐克奥地利官网:Nike奥地利
2019/08/16 全球购物
同步和异步有何异同,在什么情况下分别使用他们?举例说明
2014/02/27 面试题
护理自我鉴定范文
2013/10/06 职场文书
留学自荐信写作方法
2014/01/27 职场文书
股权投资意向书
2014/04/01 职场文书
法英专业大学生职业生涯规划书范文
2014/09/22 职场文书
党员承诺书范文2015
2015/04/27 职场文书
2016年中学植树节活动总结
2016/03/16 职场文书
Python 机器学习工具包SKlearn的安装与使用
2021/05/14 Python
Js类的构建与继承案例详解
2021/09/15 Javascript