JSON.stringify()方法讲解


Posted in Javascript onJanuary 31, 2019

JSON.stringify()方法是什么呢?

我们在向服务器发送数据时一般是字符串。

我们可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。

语法

JSON.stringify(value[, replacer[, space]])

参数说明:

value:

  • 必需,一个有效的 JSON 对象。

replacer:

  • 可选。用于转换结果的函数或数组。
  • 如果 replacer 为函数,则 JSON.stringify 将调用该函数,并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined,则排除成员。根对象的键是一个空字符串:""。
  • 如果 replacer 是一个数组,则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时,将忽略 replacer 数组。

space:

  • 可选,文本添加缩进、空格和换行符,如果 space 是一个数字,则返回值文本在每个级别缩进指定数目的空格,如果 space 大于 10,则文本缩进 10 个空格。space 有可以使用非数字,如:\t。

JavaScript 对象转换

var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"};
var myJSON = JSON.stringify(obj);   JavaScript 对象转换为JSON对象
document.getElementById("demo").innerHTML = myJSON;
//JavaScript数组转换为JSON对象
var arr = [ "Google", "Runoob", "Taobao", "Facebook" ];
var myJSON = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myJSON;

异常

解析数据

JSON 不能存储 Date 对象。

JSON.stringify() 会将所有日期转换为字符串。

<p id="demo"></p>
<script>
var obj = { "name":"Runoob", "initDate":new Date(), "site":"www.runoob.com"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>

解析函数

JSON 不允许包含函数,JSON.stringify() 会删除 JavaScript 对象的函数,包括 key 和 value。

<p id="demo"></p>
<script>
var obj = { "name":"Runoob", "alexa":function () {return 10000;}, "site":"www.runoob.com"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>

结果为

JSON.stringify 将删除对象中的函数

{"name":"Runoob","site":www.runoob.com}

我们可以在执行 JSON.stringify() 函数前将函数转换为字符串来避免以上问题的发生:

eg:<p id="demo"></p>
<script>
var obj = { "name":"Runoob", "alexa":function () {return 10000;}, "site":"www.runoob.com"};
obj.alexa = obj.alexa.toString();
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>

总结

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

Javascript 相关文章推荐
jquery animate实现鼠标放上去显示离开隐藏效果
Jul 21 Javascript
深入浅析JavaScript字符串操作方法 slice、substr、substring及其IE兼容性
Dec 16 Javascript
jQuery使用contains过滤器实现精确匹配方法详解
Feb 25 Javascript
JS学习之表格的排序简单实例
May 16 Javascript
JavaScript浮点数及运算精度调整详解
Oct 21 Javascript
详解handlebars+require基本使用方法
Dec 21 Javascript
Node.js环境下Koa2添加travis ci持续集成工具的方法
Jun 19 Javascript
JavaScript实现动态添加Form表单元素的方法示例
Aug 14 Javascript
vue eslint简要配置教程详解
Jul 26 Javascript
微信小程序 轮播图实现原理及优化详解
Sep 29 Javascript
简单了解常用的JavaScript 库
Jul 16 Javascript
Vue中ref和$refs的介绍以及使用方法示例
Jan 11 Vue.js
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
JavaScript之解构赋值的理解
Jan 30 #Javascript
You might like
php中实现记住密码自动登录的代码
2011/03/02 PHP
CI框架开发新浪微博登录接口源码完整版
2014/05/28 PHP
PHP实现搜索地理位置及计算两点地理位置间距离的实例
2016/01/08 PHP
PHP模糊查询技术实例分析【附源码下载】
2019/03/07 PHP
JavaScript.Encode手动解码技巧
2010/07/14 Javascript
解决jquery submit()提交表单提示:f[s] is not a function
2013/01/23 Javascript
JavaScript基础篇之变量作用域、传值、传址的简单介绍与实例
2013/06/29 Javascript
JavaScript获取FCK编辑器信息的具体方法
2013/07/12 Javascript
前端开发过程中浏览器版本的两种判定方法
2013/10/30 Javascript
javascript:json数据的页面绑定示例代码
2014/01/26 Javascript
javascript控制图片播放的实现代码
2020/07/29 Javascript
解决wx.onMenuShareTimeline出现的问题
2016/08/16 Javascript
Vue.directive()的用法和实例详解
2018/03/04 Javascript
JS中call和apply函数用法实例分析
2018/06/20 Javascript
快速解决vue在ios端下点击响应延时的问题
2018/08/27 Javascript
详解微信小程序-扫一扫 wx.scanCode() 扫码大变身
2019/04/30 Javascript
原生javascript自定义input[type=radio]效果示例
2019/08/27 Javascript
在vue项目中使用codemirror插件实现代码编辑器功能
2019/08/27 Javascript
进一步探究Python的装饰器的运用
2015/05/05 Python
分享Python字符串关键点
2015/12/13 Python
Python求算数平方根和约数的方法汇总
2016/03/09 Python
Python用5行代码写一个自定义简单二维码
2018/10/21 Python
Python将list元素转存为CSV文件的实现
2020/11/16 Python
纯CSS3制作的简洁蓝白风格的登录模板(非IE效果更好)
2013/08/11 HTML / CSS
美国祛痘、抗衰老药妆品牌:Murad
2016/08/27 全球购物
Revolution Beauty美国官网:英国知名化妆品网站
2018/07/23 全球购物
Ralph Lauren意大利官方网站:时尚界最负盛名的品牌之一
2018/10/18 全球购物
System.Array.CopyTo()和System.Array.Clone()有什么区别
2016/06/20 面试题
优秀学生获奖感言
2014/02/15 职场文书
工程质量月活动方案
2014/02/19 职场文书
文秘自荐信
2014/06/28 职场文书
2015年七年级班主任工作总结
2015/05/21 职场文书
再读《皇帝的新衣》的读后感悟!
2019/08/07 职场文书
手把手教你从零开始react+antd搭建项目
2021/06/03 Javascript
Java org.w3c.dom.Document 类方法引用报错
2021/08/07 Java/Android
JavaScript中document.activeELement焦点元素介绍
2021/11/27 Javascript