该函数的作用是:系列化对象
系列化对象说白了就是把对象的类型转换为字符串类型

语法

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

  • value
    将要序列化成 一个JSON 字符串的值。
  • replacer 可选
    可以为数组或函数
    1. 如果为数组:则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中,replacer作key值(这个在讲实例的时候就知道这个key是干嘛的了,先记住就好)
    2. 如果为函数:则把系列化后的每一个对象(记住是每一个)传进方法里面进行处理
  • space 可选
    指定缩进用的空白字符串
    1. 如果省略的话,那么显示出来的值就没有分隔符。直接输出来
    2. 如果是一个数字的话,那么它就定义缩进几个字符,范围是:0到10(数字小于1,则默认为0,大于10,则默认为10)
    3. 如果是一些转义字符,比如“\t”,表示回车,那么它每行一个回车。
    4. 如果仅仅是字符串,就在每行输出值的时候把这些字符串附加上去就OK。当然,最大长度也是10个字符

实例说明

注意:以下的输出结果都是string类型的,为了容易看就没有用单引号‘’表明是字符串类型

只有一个参数

参数为对象:

var students = new Array();
students[0] = "pika";
students[1] = "hello";
students[2] = "hey";
var json = JSON.stringify(students);
alert(json);
输出结果:["pika","hello","hey"]

如果不用JSON.stringify()函数,直接alert(students),那么

输出结果:pika,hello,hey

从这里到对比可以比较直观的看出JSON.stringify()函数的作用啦

看一下其他例子:

JSON.stringify({});                        // 输出结果:{}
JSON.stringify(true); // 输出结果:true
JSON.stringify("foo"); // 输出结果:"foo"
JSON.stringify([1, "false", false]); // 输出结果:[1,"false",false]
JSON.stringify({ x: 5 }); // 输出结果:{"x":5} JSON.stringify({x: 5, y: 6});
//输出结果:{"x":5,"y":6} JSON.stringify([new Number(1), new String("false"), new Boolean(false)]);
//输出结果:[1,"false",false]

从这些例子中可以看出:布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值

再看一下其他例子:

JSON.stringify({x: undefined, y: Object, z: Symbol("")});
// 输出结果:{} JSON.stringify([undefined, Object, Symbol("")]);
// 输出结果:[null,null,null]' JSON.stringify({[Symbol("foo")]: "foo"});
// 输出结果:{} JSON.stringify({[Symbol.for("foo")]: "foo"}, [Symbol.for("foo")]);
// 输出结果:{} JSON.stringify(
{[Symbol.for("foo")]: "foo"},
function (k, v) {
if (typeof k === "symbol"){
return "a symbol";
}
}
);
//输出结果:undefined

从这些例子中可以看出:undefined、任意的函数以及 symbol 值,在序列化过程中会被忽略(出现在非数组对象的属性值中时)或者被转换成 null(出现在数组中时)

再看最后一个例子

JSON.stringify(
Object.create(
null,
{
x: { value: 'x', enumerable: false },
y: { value: 'y', enumerable: true }
}
)
);

从例子中可以看出:不可枚举的属性会被忽略

有两个参数,第二个参数为函数

函数例子:

 function replacer(key, value) {
if (typeof value === "string") {
return undefined;
}
return value;
}

可以看出有一个key值,一个value值,还记得一开始说的第二个参数作key值吗?

实例:

function replacer(key, value) {
if (typeof value === "string") {
return undefined;
}
return value;
} var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
var jsonString = JSON.stringify(foo, replacer);
//输出结果:{"week":45,"month":7}

就是把第一个值传去函数进行相关的处理

有两个参数,第二个参数为数组

第一个参数为数组

var students = new Array();
students[0] = "pika";
students[1] = "hello";
students[2] = "hey";
var stu= new Array();
stu[0] = "how";
stu[1] = "are";
stu[2] = "u";
var json = JSON.stringify(students,stu);
alert(json);
//输出结果:["pika","hello","hey"]

结果是只有第一个值序列化了,第二个被忽略了

第一个参数为对象

var students = new Object();
students.name = "pika";
students.age = 19;
students.qq = "12345678";
var stu= new Array();
stu[0] = "name";
stu[1] = "qq";
var json = JSON.stringify(students,stu);
alert(json);
//输出结果:{"name":"pika","qq":"12345678"}

数组的值代表将被序列化成JSON字符串的属性名
stu数组没有“age”,所以students对象的“age”属性没有显示

有三个参数

前面说到第三个参数就是用来缩进或者直接添加字符串在序列化对象的前面,所以直接看例子就行啦,注意最多只能10个缩进或字符

JSON.stringify({ a: 2 }, null, " ");
// 输出结果:{\n "a": 2\n} JSON.stringify({ uno: 1, dos : 2 }, null, '\t')
/* 输出结果:
{
"uno": 1,
"dos": 2
}
*/ var students = new Object();
students.name = "pika";
students.age = 19;
students.qq = "12345678";
var stu= new Array();
stu[0] = "name";
stu[1] = "qq";
var json = JSON.stringify(students,stu,"test")
alert(json);
/* 输出结果:
{
test"name": "pika",
test"qq": "12345678"
}
*/

总结

最后来总结一下,JSON.stringify()函数是用来序列化对象的,无论输入什么,输出的都是字符串类型,可以按自己的需求来定制如何序列化,输出结果是怎样的格式

JSON.stringify()序列化的理解及使用的更多相关文章

  1. JSON.stringify() 的深入理解

    目录 序言 语法 深入理解 序言 最近在看<你所不知道的javascript>[中卷]一书,第一部分是类型和语法.本文是基于这部分的产物.在强制类型转换->抽象值操作-> to ...

  2. JSON.parse()与JSON.stringify()高级用法

    JSON.parse()与JSON.stringify是将JSON对象与字符串互相转换的方法,它们还有一些参数可以让我们在实际应用中更加方便,现在介绍一下它们的高级用法 JSON.parse() JS ...

  3. 理解JSON对象:JSON.parse、 JSON.stringify

    何时是JSON,何时不是JSON? JSON就是一个有特殊规则的字符串,按照这个规则我们就可以把这个字符串解析成JS对象. JSON是设计成描述数据交换格式的,他也有自己的语法,这个语法是JavaSc ...

  4. json.stringify和json.parse,序列化和反序列化

    json.stringify()是序列化函数,用于将对象转化为字符串:json.parse()是反序列化函数,用于将字符串转化为json对象 一.序列化: var o={name:'wen',age: ...

  5. js解析与序列化json数据(一)json.stringify()的基本用法

    对象有两个方法:stringify()和parse().在最简单的情况下,这两个方法分别用于把JavaScript对象序列化为JSON字符串和把JSON字符串解析为原生JavaScript 早期的JS ...

  6. js对象序列化JSON.stringify()与反序列化JSON.parse()

    草稿: parse用于从一个字符串中解析出json对象,如 var str = '{"name":"huangxiaojian","age" ...

  7. 理解JSON.stringify()高级用法

    一:JSON.stringify() 该方法是把javascript对象转换成json字符串. 基本语法:JSON.stringify(value, [, replacer], [, space]) ...

  8. 关于对JSON.parse()与JSON.stringify()的理解

    JSON.parse()与JSON.stringify()的区别   JSON.parse()[从一个字符串中解析出json对象] 例子: //定义一个字符串 var data='{"nam ...

  9. this.treeData = JSON.parse(JSON.stringify(this.d)) 树的序列化反序列化

    this.treeData = JSON.parse(JSON.stringify(this.d))

随机推荐

  1. 工作拾记 - 关于easyui模板后台改为vue-element

    图1: 数据接口,模拟实现一些基本的数据条目 图2: 获取数据,接口都在src/api中 TODO LIST: 接下来要做的呢: 1. 完善此demo,基本的CURD,现在只有getAll,需要将增加 ...

  2. BZOJ 4816[SDOI2017]数字表格(莫比乌斯反演)

    题目链接 \(Description\) 用\(f_i\)表示\(fibonacci\)数列第\(i\)项,求\(\prod_{i=1}^{n}\prod_{j=1}^{m}f[gcd(i,j)]\) ...

  3. 字典树(Trie)学习笔记

    目录 什么是字典树 如何存储字典树 如何查找字符串有没有出现 第一个图的那种线段树 应用 例题 1.统计难题 2.P2580 于是他错误的点名开始了 什么是字典树 上图来自luogu题解 这是一种字典 ...

  4. 洛谷 P2040 打开所有的灯 题解

    这个题写其他题解的dalao们已经解释了 一个灯最多开一次(如果实在不知道为什么看评论区) 这个题一共就9个灯嘛,对吧 递归好想不好写(对于我这种蒟蒻) 所以我写了一个所有题解中最暴力的 直接枚举9个 ...

  5. 洛谷P2312 解方程题解

    洛谷P2312 解方程题解 题目描述 已知多项式方程: \[a_0+a_1x+a_2x^2+\cdots+a_nx^n=0\] 求这个方程在 \([1,m]\) 内的整数解(\(n\) 和 \(m\) ...

  6. shell 空语句

    在shell脚本中“:”是空命令,表示什么都不做类似于python中的pass

  7. 在spring boot里使用undertow而非tomcat

    参考https://examples.javacodegeeks.com/enterprise-java/spring/tomcat-vs-jetty-vs-undertow-comparison-o ...

  8. 使用iis部署asp.net core 中的坑

    使用vs2017创建asp.net core mvc 模板网站然后部署到iis上,如果在一直有并发访问的情况下,操作iis重新绑定域名操作,网站会直接挂掉,重启应用池也没用,而且部署到iis上容易出现 ...

  9. 主题模型TopicModel:主题模型LDA的应用

    http://blog.csdn.net/pipisorry/article/details/45665779 主题模型LDA的应用 拿到这些topic后继续后面的这些应用怎么做呢:除了推断出这些主题 ...

  10. 树莓派3B+红外配置

    sudo apt-get install lirc /etc/lirc/lirc_options.conf #driver = devinput driver = default #device = ...