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

语法

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. 洛谷 P1873 【砍树】

    P1873 传送门 题外话 话说我们也要当一当光头强?? 大体题意 就是让你砍树,统一的高度,然后让你砍树,看看订什么高度合适. 思路: 二分答案,对高度二分,如果砍得树长度不够,那就说明高度高了. ...

  2. javascript利用canvas解析图片中的二维码

    本方法两种应用方式:一种使用canvas解析本站图片中的二维码,canvas有同源策略限制,只能处理本站图片.另一种处理文件选择中的图片二维码. 第一种使用场景可以换成像微信中一样,长按图片识别二维码 ...

  3. 第10组 Alpha冲刺(2/4)

    队名:凹凸曼 组长博客 作业博客 组员实践情况 童景霖 过去两天完成了哪些任务 文字/口头描述 继续学习Android studio和Java 完善项目APP原型 展示GitHub当日代码/文档签入记 ...

  4. 如何设置select只读不可编辑且select的值可传递(摘自百度)

    selectname="role"id="role"οnfοcus="this.defaultIndex=this.selectedIndex;&qu ...

  5. python 项目实战之装饰器

    import logging def use_logging(func): def writelog(*args, **kwargs): logging.warning("%s is run ...

  6. 浅析String.intern()方法

    1.String类型“==”比较样例代码如下:package com.luna.test;public class StringTest { public static void main(Strin ...

  7. 批量实现ssh免密登录

    本节索引 场景分析 ssh免密登录 pssh工具批量管理 SHELL自动化脚本 本篇总结 场景分析 作为一个运维工程师,不是每个人工作的环境都想阿里.腾讯那样,动不动就上亿的PV量,上万台服务器.我们 ...

  8. Js设置打印缩放

    近期需要优化一个打印项目,因为是固定长度,所以需要缩放打印,记录一下 //获取打印的页面内容 let subOutputRankPrint = document.getElementById('pri ...

  9. 泡泡一分钟:Real-Time Vehicle Detection from Short-Range Aerial Image with Compressed MobileNet

    张宁 Real-Time Vehicle Detection from Short-Range Aerial Image with Compressed MobileNet链接:https://pan ...

  10. win10 system guard运行时监视器,关闭服务

    这个服务,内存占用了高达21%,造成工作电脑运行缓慢,经常卡死1min,要关闭服务,并不能直接在任务管理器“服务”这里对属性进行修改,会提示“拒绝访问”,即使修改了文件夹属性也不可以,要修改注册表方可 ...