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 相关文章推荐
Underscore.js 的模板功能介绍与应用
Dec 24 Javascript
jQuery实现类似滑动门切换效果的层切换
Sep 23 Javascript
JS实现仿QQ效果的三级竖向菜单
Sep 25 Javascript
javascript实现tab切换的四种方法
Nov 05 Javascript
jquery显示隐藏元素的实现代码
May 19 Javascript
浅谈JSON.stringify()和JOSN.parse()方法的不同
Aug 29 Javascript
Vue.set()动态的新增与修改数据,触发视图更新的方法
Sep 15 Javascript
JS通过ajax + 多列布局 + 自动加载实现瀑布流效果
May 30 Javascript
Node.js fs模块(文件模块)创建、删除目录(文件)读取写入文件流的方法
Sep 03 Javascript
关于layui的下拉搜索框异步加载数据的解决方法
Sep 28 Javascript
Vue使用自定义指令实现拖拽行为实例分析
Jun 06 Javascript
JavaScript前端开发时数值运算的小技巧
Jul 28 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
JavaScript之解构赋值的理解
Jan 30 #Javascript
You might like
Laravel 5 框架入门(一)
2015/04/09 PHP
地址栏上的一段语句,改变页面的风格。(教程)
2008/04/02 Javascript
读jQuery之六 缓存数据功能介绍
2011/06/21 Javascript
基于JavaScript实现继承机制之原型链(prototype chaining)的详解
2013/05/07 Javascript
js中判断对象是否为空的三种实现方法
2013/12/23 Javascript
JS图片无缝、平滑滚动代码
2014/03/11 Javascript
图片放大镜jquery.jqzoom.js使用实例附放大镜图标
2014/06/19 Javascript
JavaScript事件委托实例分析
2015/05/26 Javascript
jquery简单实现外部链接用新窗口打开的方法
2015/05/30 Javascript
Knockoutjs 学习系列(二)花式捆绑
2016/06/07 Javascript
浅谈js for循环输出i为同一值的问题
2017/03/01 Javascript
浅析Javascript中双等号(==)隐性转换机制
2017/10/27 Javascript
详解Webpack如何引入CDN链接来优化编译后的体积
2019/06/21 Javascript
js实现for循环跳过undefined值示例
2019/07/02 Javascript
Vue移动端实现图片上传及超过1M压缩上传
2019/12/23 Javascript
JavaScript实现Excel表格效果
2020/02/07 Javascript
Python模块WSGI使用详解
2018/02/02 Python
Python设计模式之迭代器模式原理与用法实例分析
2019/01/10 Python
Python饼状图的绘制实例
2019/01/15 Python
Python语言进阶知识点总结
2019/05/28 Python
Python直接赋值、浅拷贝与深度拷贝实例分析
2019/06/18 Python
导入tensorflow时报错:cannot import name 'abs'的解决
2019/10/10 Python
JupyterNotebook设置Python环境的方法步骤
2019/12/03 Python
Python使用py2neo操作图数据库neo4j的方法详解
2020/01/13 Python
TensorBoard 计算图的查看方式
2020/02/15 Python
如何设置PyCharm中的Python代码模版(推荐)
2020/11/20 Python
东方红海科技面试题软件测试方面
2012/02/08 面试题
市场营销管理制度
2014/01/29 职场文书
个人查摆剖析材料
2014/10/16 职场文书
教师先进个人材料
2014/12/17 职场文书
党员年度个人总结
2015/02/14 职场文书
企业承诺书格式范文
2015/04/28 职场文书
2015年主婚人婚礼致辞
2015/07/28 职场文书
Python数据分析入门之数据读取与存储
2021/05/13 Python
漫画《尖帽子的魔法工坊》宣布动画化
2022/04/06 日漫
教你nginx跳转配置的四种方式
2022/07/07 Servers