JSON的parse()方法介绍


Posted in Javascript onJanuary 31, 2019

parse()方法的介绍:

在接收服务器数据时一般是字符串。

我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

语法

JSON.parse(text[, reviver])

参数说明:

  • text:必需, 一个有效的 JSON 字符串。
  • reviver: 可选,一个转换结果的函数, 将为对象的每个成员调用此函数。

下面我们来看一个实例:

<p id="demo"></p>
<script>
var obj = JSON.parse('{ "name":3water", "alexa":10000, "site":3water.com }');
document.getElementById("demo").innerHTML = obj.name + ":" + obj.site;
</script>

首先通过parse()方法将JSON数据转换为JavaScript对象,

解析完成后,我们就可以在网页上使用JSON数据了

从服务端接收 JSON 数据(数组JSON数据)

我们可以使用 AJAX 从服务器请求 JSON 数据,并解析为 JavaScript 对象。

eg:
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myObj = JSON.parse(this.responseText);
document.getElementById("demo").innerHTML = myObj.name;
} };
xmlhttp.open("GET", "/try/ajax/json_demo.txt", true); xmlhttp.send();

json_demo.txt服务端数据需要自个编写。

JSON中有个异常解析数据

JSON 不能存储 Date 对象。如果你需要存储 Date 对象,需要将其转换为字符串。之后再将字符串转换为 Date 对象。

<p id="demo"></p>
<script>      //将字符串转换为data对象
var text = '{ "name":"csdn", "initDate":"2018-12-14", "site":3water.com}';
var obj = JSON.parse(text);
obj.initDate = new Date(obj.initDate);
document.getElementById("demo").innerHTML = obj.name + "创建日期: " + obj.initDate;
</script>

这时我们可以启用JSON的第二个参数:

<p id="demo"></p>
<script>
var text = '{ "name":"csdn", "initDate":"2018-12-14", "site":"3water.com"}';
var obj = JSON.parse(text, function (key, value) {
  if (key == "initDate") {
    return new Date(value);
  } else {
    return value;
}});
document.getElementById("demo").innerHTML = obj.name + "创建日期:" + obj.initDate;

解析函数:

JSON 不允许包含函数,但你可以将函数作为字符串存储,之后再将字符串转换为函数。

var text = '{ "name":"3water", "alexa":"function () {
return 10000;}",
"site":"3water.com"}';
var obj = JSON.parse(text);
obj.alexa = eval("(" + obj.alexa + ")");      注意:最好不要在json中使用函数
document.getElementById("demo").innerHTML = obj.name + " Alexa 排名:" + obj.alexa();

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Javascript 相关文章推荐
jQuery toggle()设置CSS样式
Nov 05 Javascript
JS中的异常处理方法分享
Dec 22 Javascript
javascript实现无限级select联动菜单
Jan 02 Javascript
javascript实现rgb颜色转换成16进制格式
Jul 10 Javascript
基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式
Oct 28 Javascript
bootstrap网页框架的使用方法
May 10 Javascript
node.js 利用流实现读写同步,边读边写的方法
Sep 11 Javascript
Vuex 在Vue 组件中获得Vuex 状态state的方法
Aug 27 Javascript
js实现选项卡效果
Mar 07 Javascript
JS对象属性的检测与获取操作实例分析
Mar 17 Javascript
解决vue-router 切换tab标签关闭时缓存问题
Jul 22 Javascript
element-ui和vue表单(对话框)验证提示语(残留)清除操作
Sep 11 Javascript
JSON.stringify()方法讲解
Jan 31 #Javascript
Vue实现远程获取路由与页面刷新导致404错误的解决
Jan 31 #Javascript
vue中的mvvm模式讲解
Jan 31 #Javascript
Vue和React组件之间的传值方式详解
Jan 31 #Javascript
使用Angular Cli如何创建Angular私有库详解
Jan 30 #Javascript
async/await优雅的错误处理方法总结
Jan 30 #Javascript
新年快乐! javascript实现超级炫酷的3D烟花特效
Jan 30 #Javascript
You might like
全国FM电台频率大全 - 10 江苏省
2020/03/11 无线电
js实现iframe动态调整高度的代码
2008/01/06 Javascript
实现web打印的各种方法介绍及实现代码
2013/01/09 Javascript
js中回调函数的学习笔记
2014/07/31 Javascript
实用框架(iframe)操作代码
2014/10/23 Javascript
jQuery编程中的一些核心方法简介
2015/08/14 Javascript
jQuery-1.9.1源码分析系列(十)事件系统之事件包装
2015/11/20 Javascript
easyui form validate总是返回false的原因及解决方法
2016/11/07 Javascript
利用PM2部署node.js项目的方法教程
2017/05/10 Javascript
jQuery查找dom的几种方法效率详解
2017/05/17 jQuery
three.js加载obj模型的实例代码
2017/11/10 Javascript
three.js中文文档学习之通过模块导入
2017/11/20 Javascript
vue-cli axios请求方式及跨域处理问题
2018/03/28 Javascript
JS高阶函数原理与用法实例分析
2019/01/15 Javascript
使用 UniApp 实现小程序的微信登录功能
2020/06/09 Javascript
Python中map和列表推导效率比较实例分析
2015/06/17 Python
python利用matplotlib库绘制饼图的方法示例
2016/12/18 Python
关于Python中浮点数精度处理的技巧总结
2017/08/10 Python
使用Python微信库itchat获得好友和群组已撤回的消息
2018/06/24 Python
Python3数据库操作包pymysql的操作方法
2018/07/16 Python
python pandas消除空值和空格以及 Nan数据替换方法
2018/10/30 Python
使用Python将Mysql的查询数据导出到文件的方法
2019/02/25 Python
Python PyInstaller安装和使用教程详解
2020/01/08 Python
django实现将后台model对象转换成json对象并传递给前端jquery
2020/03/16 Python
解决django的template中如果无法引用MEDIA_URL问题
2020/04/07 Python
python小技巧——将变量保存在本地及读取
2020/11/13 Python
Python自动化测试基础必备知识点总结
2021/02/07 Python
python matplotlib工具栏源码探析三之添加、删除自定义工具项的案例详解
2021/02/25 Python
全球最大的在线橄榄球商店:Lovell Rugby
2018/05/20 全球购物
聚美优品广告词改编
2014/03/14 职场文书
实习单位评语
2014/04/26 职场文书
保险公司演讲稿
2014/09/02 职场文书
社区母亲节活动总结
2015/02/10 职场文书
公司财务人员岗位职责
2015/04/14 职场文书
赡养老人协议书范本
2015/08/06 职场文书
清明扫墓感想
2015/08/11 职场文书