理解JSON.stringify()高级用法
一：JSON.stringify()
该方法是把javascript对象转换成json字符串。
基本语法：JSON.stringify(value, [, replacer], [, space])
value: 必选字段，指输入的对象，比如数组这些。
replacer，该参数是可选的，它可以有两种类型，第一种是数组，第二种是函数方法。
space: 该参数的含义是指使用什么来做分隔符的。
1）如果该参数省略的话，那么显示出来的值是没有分隔符的。
2）如果是一个数字的话，那么它的含义是 缩进几个字符的意思，最大值为10.
3）如果是一个转义字符的话，比如 '\t', 表示回车，那么它每行一个回车。
4）如果是字符串的话，那么每行输出值的时候把这些字符串附加上去，最大长度也是10个字符。
下面是一个简单的json对象，如下代码：
var json = {
"name": "kongzhi",
"age": "30",
"lists": [
{"name": "xxx1", "age": "28"},
{"name": "xxx2", "age": "29"},
{"name": "xxx3", "age": "30"}
]
};
1) 只有一个参数值的情况下；如下代码：
<!DOCTYPE html>
<html>
<head>
<title>演示Vue</title>
<style> </style>
</head>
<body>
<script type="text/javascript">
var json = {
"name": "kongzhi",
"age": "30",
"lists": [
{"name": "xxx1", "age": "28"},
{"name": "xxx2", "age": "29"},
{"name": "xxx3", "age": "30"}
]
};
var result = JSON.stringify(json);
// 输出结果为 {"name":"kongzhi","age":"30","lists":[{"name":"xxx1","age":"28"},{"name":"xxx2","age":"29"},{"name":"xxx3","age":"30"}]}
console.log(result);
</script>
</body>
</html>
2.1）第二个参数存在，且第二个参数是数组。
如果第二个参数是数组，并且第二个参数的值在第一个数据中存在的话，那么它就会以第二个参数的值当做key，第一个参数的值为value表示。如果第二个参数数组有多项的话，以此类推...，如果不匹配数据的话，则忽略。如下代码：
<!DOCTYPE html>
<html>
<head>
<title>演示Vue</title>
<style> </style>
</head>
<body>
<script type="text/javascript">
var json = {
"name": "kongzhi",
"age": "30",
"lists": [
{"name": "xxx1", "age": "28"},
{"name": "xxx2", "age": "29"},
{"name": "xxx3", "age": "30"}
]
};
var arrs = ['lists', 'name'];
var result = JSON.stringify(json, arrs);
// 输出结果为 {"lists":[{"name":"xxx1"},{"name":"xxx2"},{"name":"xxx3"}],"name":"kongzhi"}
console.log(result);
</script>
</body>
</html>
2.2）第二个参数存在，且第二个参数是方法
如果第二个参数是一个方法的话，那么该函数会有两个参数，key和value，我们可以在函数内部改变json数据的值，如下代码：
<!DOCTYPE html>
<html>
<head>
<title>演示Vue</title>
<style> </style>
</head>
<body>
<script type="text/javascript">
var json = {
"name": "kongzhi",
"age": "30",
"lists": [
{"name": "xxx1", "age": "28"},
{"name": "xxx2", "age": "29"},
{"name": "xxx3", "age": "30"}
]
};
var result = JSON.stringify(json, function(key, value) {
switch(key) {
case "name":
return 'longen';
case "age":
return '31';
default:
return value;
}
});
// 输出结果为 {"name":"longen","age":"31","lists":[{"name":"longen","age":"31"},{"name":"longen","age":"31"},{"name":"longen","age":"31"}]}
console.log(result);
</script>
</body>
</html>
3）第三个参数存在
第二个参数如果不传的话，可以写null, 第三个参数是控制json字符串缩进的，它可以是数字或字符串，数字最多可以缩进10个，如果传入的是字符串的话，则会使用这个字符串当做缩进符来代替空格。
3.1 数字（控制json字符串缩进的，几个数字代表几个缩进） 如下代码：
<!DOCTYPE html>
<html>
<head>
<title>演示Vue</title>
<style> </style>
</head>
<body>
<script type="text/javascript">
var json = {
"name": "kongzhi",
"age": "30",
"lists": [
{"name": "xxx1", "age": "28"},
{"name": "xxx2", "age": "29"},
{"name": "xxx3", "age": "30"}
]
};
var result = JSON.stringify(json, null, 4);
/*
输出结果为：
{
"name": "kongzhi",
"age": "30",
"lists": [
{
"name": "xxx1",
"age": "28"
},
{
"name": "xxx2",
"age": "29"
},
{
"name": "xxx3",
"age": "30"
}
]
}
*/
console.log(result);
</script>
</body>
</html>
3.2 字符串（控制json字符串缩进的，字符串的话，则会使用这个字符串当做缩进符来代替空格），如下代码：
<!DOCTYPE html>
<html>
<head>
<title>演示Vue</title>
<style> </style>
</head>
<body>
<script type="text/javascript">
var json = {
"name": "kongzhi",
"age": "30",
"lists": [
{"name": "xxx1", "age": "28"},
{"name": "xxx2", "age": "29"},
{"name": "xxx3", "age": "30"}
]
};
var result = JSON.stringify(json, null, 'aa');
/*
输出结果为：
{
aa"name": "kongzhi",
aa"age": "30",
aa"lists": [
aaaa{
aaaaaa"name": "xxx1",
aaaaaa"age": "28"
aaaa},
aaaa{
aaaaaa"name": "xxx2",
aaaaaa"age": "29"
aaaa},
aaaa{
aaaaaa"name": "xxx3",
aaaaaa"age": "30"
aaaa}
aa]
}
*/
console.log(result);
</script>
</body>
</html>
理解JSON.stringify()高级用法的更多相关文章
- JSON.parse()与JSON.stringify()高级用法
JSON.parse()与JSON.stringify是将JSON对象与字符串互相转换的方法,它们还有一些参数可以让我们在实际应用中更加方便,现在介绍一下它们的高级用法 JSON.parse() JS ...
- Newtonsoft.Json 的高级用法
Ø 简介 接着前一篇http://www.cnblogs.com/abeam/p/8295765.html,继续研究 Newtonsoft.Json 的一些高级用法.主要包括: 1. JSON ...
- JSON.stringify常见用法
转摘于其他博客 var data =[ { name: "金",sex:"1",age:26 }, { name: "才",sex:&quo ...
- JSON.parse()和JSON.stringify() 的用法区别
parse用于从一个字符串中解析出json对象,如 var str = '{"name":"huangxiaojian","age":&qu ...
- JSON.parse()和JSON.stringify()的用法
JSON.parse()是用于从一个字符串中解析出json对象,如下所示 var str = '{"name":"flsummer","age&quo ...
- JSON.stringify实战用法
1.首先定义一个数组 var teamPlanMinList = new Array(); 2. 定义一个json对象 var json = { "plname":plname, ...
- JSON.stringify()的用法
**JSON.stringify() 方法用于将 JavaScript 值转换为 JSON 字符串,而我们一般只是用了第一个参数,没有在意过第二个以及第三个参数的妙用** **1.最常用的方式:** ...
- Jmeter 中JSON Path Extractor高级用法
好久没玩jemter了,由于项目原因又重新拾起.在使用JSON Path Extractor(jmeter 4.0已经默认支持了,4.0以下要自行安装插件)时,可以进行条件过滤,不用再自行写shell ...
- Newtonsoft.Json高级用法之枚举中文转义
最近看博客园中 焰尾迭的两篇关于"Newtonsoft.Json高级用法"的文章受到了很多人的评论,一度登入到头条推荐. 今天我就不再重复焰尾迭博文中的一些提过的Newtonsof ...
随机推荐
- Moco服务器jar包实现简易的API搭建
永远不要停止前进的脚步,就像你不会忘记以前那些窘迫的连一无所有都称不上的裸露的记忆一样.追求永远的打怪升级,武装自己.双手的努力让曾经那些不堪的记忆在时间的长河中渐渐风化隐匿,但请不要忘记它留下的那一 ...
- 【Java并发编程】16、ReentrantReadWriteLock源码分析
一.前言 在分析了锁框架的其他类之后,下面进入锁框架中最后一个类ReentrantReadWriteLock的分析,它表示可重入读写锁,ReentrantReadWriteLock中包含了两种锁,读锁 ...
- Git的概念及常用命令
一.概念 Git是一个分布式的版本控制工具,区别于集中式管理的SVN. 二.优势 每个开发者都拥有自己的本地版本库,可以在本地任意修改代码.创建分支,不会影响到其他开发者的使用: 所有版本信息均保存在 ...
- Netty网络聊天(一) 聊天室实战
首发地址; Netty网络聊天(一) 聊天室实战 之前做过一个IM的项目,里面涉及了基本的聊天功能,所以注意这系列的文章不是练习,不含基础和逐步学习的部分,直接开始实战和思想引导,基础部分需要额外的去 ...
- 读 《CSharp Coding Guidelines》有感
目录 基本原则 类设计指南 属性成员设计指南 其他设计指南 可维护性指南 命名指南 性能指南 框架指南 文档指南 布局指南 相关链接 C# 编程指南 前不久在 Github 上看见了一位大牛创建一个仓 ...
- python字典按照value进行排序
先说几个解决的方法,具体的有时间再细说 d = {'a':1,'b':4,'c':2} 字典是这个,然后要对字典按照value进行排序 方法一: sorted(d.items(),key = lamb ...
- 使用Via浏览器+ADM下载器突破百度网盘下载限速
1.下载必要工具 via浏览器 ADM下载器 2.自定义 UA UA 是一串特殊字符,用来告诉所访问的网站,手机使用的操作系统及版本.CPU 类型.浏览器及版本等信息.UA 内容如下: Mozilla ...
- VUE 配置vue-devtools调试工具
1. 通过 Git 克隆项目到本地 git clone https://github.com/vuejs/vue-devtools.git 2. Git 进入到 vue-devtools 所在目录,然 ...
- 安卓开发_关于WebView加载页面空白问题
依据我自己的测试,发现有时候用APP打开网页的时候,有的网页加载成功之前需要很久,有的一下就出来了(比如百度) 当加载时间过长的情况下,这时候显示的是空白界面,其实不是代码问题,只是要打开的这个网页太 ...
- java web中java和python混合使用
利用java web技术展示python算法处理后的数据 工具/原料 myeclipse10 pycharm+Anaconda2 方法/步骤 首先安装配置好pycharm+Anaconda ...