JSON.stringify()

Stella981
• 阅读 354

**JSON.stringify()** 

将一个JavaScript值(对象或者数组)转换为一个 JSON字符串,如果指定了replacer是一个函数,则可以选择性的替换值,或者如果指定了replacer是一个数组,可选择性的仅包含数组指定的属性。

语法:JSON.stringify(_value_[, _replacer_ [, _space_]])

参数:

value将要序列化成 一个JSON 字符串的值。

replacer 可选如果该参数是一个函数,则在序列化过程中,被序列化的值的每个属性都会经过该函数的转换和处理;如果该参数是一个数组,则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中;如果该参数为null或者未提供,则对象所有的属性都会被序列化;关于该参数更详细的解释和示例,请参考使用原生的 JSON 对象一文。

space 可选指定缩进用的空白字符串,用于美化输出(pretty-print);如果参数是个数字,它代表有多少的空格;上限为10。该值若小于1,则意味着没有空格;如果该参数为字符串(字符串的前十个字母),该字符串将被作为空格;如果该参数没有提供(或者为null)将没有空格。

返回值:一个表示给定值的JSON字符串。

JSON.stringify()将值转换为相应的JSON格式:

  • 转换值如果有toJSON()方法,该方法定义什么值将被序列化。
  • 非数组对象的属性不能保证以特定的顺序出现在序列化后的字符串中。
  • 布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值。
  • undefined、任意的函数以及 symbol 值,在序列化过程中会被忽略(出现在非数组对象的属性值中时)或者被转换成 null(出现在数组中时)。函数、undefined被单独转换时,会返回undefined,如JSON.stringify(function(){}) or JSON.stringify(undefined).
  • 对包含循环引用的对象(对象之间相互引用,形成无限循环)执行此方法,会抛出错误。
  • 所有以 symbol 为属性键的属性都会被完全忽略掉,即便 replacer 参数中强制指定包含了它们。
  • Date日期调用了toJSON()将其转换为了string字符串(同Date.toISOString()),因此会被当做字符串处理。
  • NaN和Infinity格式的数值及null都会被当做null。
  • 其他类型的对象,包括Map/Set/weakMap/weakSet,仅会序列化可枚举的属性。
  •    1 JSON.stringify({});                        // '{}'
       2 JSON.stringify(true);                      // 'true'
       3 JSON.stringify("foo");                     // '"foo"'
       4 JSON.stringify([1, "false", false]);       // '[1,"false",false]'
       5 JSON.stringify({ x: 5 });                  // '{"x":5}'
       6 
       7 JSON.stringify({x: 5, y: 6});              
       8 // "{"x":5,"y":6}"
       9 
      10 JSON.stringify([new Number(1), new String("false"), new Boolean(false)]); 
      11 // '[1,"false",false]'
      12 
      13 JSON.stringify({x: undefined, y: Object, z: Symbol("")}); 
      14 // '{}'
      15 
      16 JSON.stringify([undefined, Object, Symbol("")]);          
      17 // '[null,null,null]' 
      18 
      19 JSON.stringify({[Symbol("foo")]: "foo"});                 
      20 // '{}'
      21 
      22 JSON.stringify({[Symbol.for("foo")]: "foo"}, [Symbol.for("foo")]);
      23 // '{}'
      24 
      25 JSON.stringify(
      26     {[Symbol.for("foo")]: "foo"}, 
      27     function (k, v) {
      28         if (typeof k === "symbol"){
      29             return "a symbol";
      30         }
      31     }
      32 );
      33 
      34 
      35 // undefined 
      36 
      37 // 不可枚举的属性默认会被忽略:
      38 JSON.stringify( 
      39     Object.create(
      40         null, 
      41         { 
      42             x: { value: 'x', enumerable: false }, 
      43             y: { value: 'y', enumerable: true } 
      44         }
      45     )
      46 );
      47 
      48 // "{"y":"y"}"
    

replacer参数

可以是一个函数或者一个数组。作为函数,它有两个参数,键(key)值(value)都会被序列化。

  • 如果返回一个 Number, 转换成相应的字符串被添加入JSON字符串。
  • 如果返回一个 String, 该字符串作为属性值被添加入JSON。
  • 如果返回一个 Boolean, "true" 或者 "false"被作为属性值被添加入JSON字符串。
  • 如果返回任何其他对象,该对象递归地序列化成JSON字符串,对每个属性调用replacer方法。除非该对象是一个函数,这种情况将不会被序列化成JSON字符串。
  • 如果返回undefined,该属性值不会在JSON字符串中输出。

注意: 不能用replacer方法,从数组中移除值(values),如若返回undefined或者一个函数,将会被null取代。

例子(function)

1 function replacer(key, value) {
2   if (typeof value === "string") {
3     return undefined;
4   }
5   return value;
6 }
7 
8 var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
9 var jsonString = JSON.stringify(foo, replacer);

JSON序列化结果为 {"week":45,"month":7}.

例子(array)

如果replacer是一个数组,数组的值代表将被序列化成JSON字符串的属性名。

JSON.stringify(foo, ['week', 'month']);  
// '{"week":45,"month":7}', 只保留“week”和“month”属性值。

space 参数

用来控制结果字符串里面的间距。如果是一个数字, 则在字符串化时每一级别会比上一级别缩进多这个数字值的空格(最多10个空格);如果是一个字符串,则每一级别会比上一级别多缩进用该字符串(或该字符串的前十个字符)。

1 JSON.stringify({ a: 2 }, null, " ");   // '{\n "a": 2\n}'
2 //使用制表符(\t)来缩进:
3 
4 JSON.stringify({ uno: 1, dos : 2 }, null, '\t')
5 // '{            \
6 //     "uno": 1, \
7 //     "dos": 2  \
8 // }'

toJSON 方法

如果一个被序列化的对象拥有 toJSON 方法,那么该 toJSON 方法就会覆盖该对象默认的序列化行为:不是那个对象被序列化,而是调用 toJSON 方法后的返回值会被序列化,例如:

1 var obj = {
2   foo: 'foo',
3   toJSON: function () {
4     return 'bar';
5   }
6 };
7 JSON.stringify(obj);      // '"bar"'
8 JSON.stringify({x: obj}); // '{"x":"bar"}'

JSON.stringify用作 JavaScript

注意JSON不是javascript严格意义上的子集,在JSON中不需要省略两条终线(Line separator和Paragraph separator)但在JavaScript中需要被省略。因此,如果JSON被用作JSONP时,下面方法可以使用:

 1 function jsFriendlyJSONStringify (s) {
 2     return JSON.stringify(s).
 3         replace(/\u2028/g, '\\u2028').
 4         replace(/\u2029/g, '\\u2029');
 5 }
 6 
 7 var s = {
 8     a: String.fromCharCode(0x2028),
 9     b: String.fromCharCode(0x2029)
10 };
11 try {
12     eval('(' + JSON.stringify(s) + ')');
13 } catch (e) {
14     console.log(e); // "SyntaxError: unterminated string literal"
15 }
16 
17 // No need for a catch
18 eval('(' + jsFriendlyJSONStringify(s) + ')');
19 
20 // console.log in Firefox unescapes the Unicode if
21 //   logged to console, so we use alert
22 alert(jsFriendlyJSONStringify(s)); // {"a":"\u2028","b":"\u2029"}

使用 JSON.stringify 结合 localStorage 的例子

一些时候,你想存储用户创建的一个对象,并且,即使在浏览器被关闭后仍能恢复该对象。下面的例子是 JSON.stringify 适用于这种情形的一个样板:

 1 // 创建一个示例数据
 2 var session = {
 3     'screens' : [],
 4     'state' : true
 5 };
 6 session.screens.push({"name":"screenA", "width":450, "height":250});
 7 session.screens.push({"name":"screenB", "width":650, "height":350});
 8 session.screens.push({"name":"screenC", "width":750, "height":120});
 9 session.screens.push({"name":"screenD", "width":250, "height":60});
10 session.screens.push({"name":"screenE", "width":390, "height":120});
11 session.screens.push({"name":"screenF", "width":1240, "height":650});
12 
13 // 使用 JSON.stringify 转换为 JSON 字符串
14 // 然后使用 localStorage 保存在 session 名称里
15 localStorage.setItem('session', JSON.stringify(session));
16 
17 // 然后是如何转换通过 JSON.stringify 生成的字符串,该字符串以 JSON 格式保存在 localStorage 里
18 var restoredSession = JSON.parse(localStorage.getItem('session'));
19 
20 // 现在 restoredSession 包含了保存在 localStorage 里的对象
21 console.log(restoredSession);
点赞
收藏
评论区
推荐文章
blmius blmius
1年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
光头强的博客 光头强的博客
5个月前
Java面向对象试题
1、请创建一个Animal动物类,要求有方法eat()方法,方法输出一条语句“吃东西”。创建一个接口A,接口里有一个抽象方法fly()。创建一个Bird类继承Animal类并实现接口A里的方法输出一条有语句“鸟儿飞翔”,重写eat()方法输出一条语句“鸟儿吃虫”。在Test类中向上转型创建b对象,调用eat方法。然后向下转型调用eat()方
刚刚好 刚刚好
5个月前
css问题
1、在IOS中图片不显示(给图片加了圆角或者img没有父级)<div<imgsrc""/</divdiv{width:20px;height:20px;borderradius:20px;overflow:h
小森森 小森森
5个月前
校园表白墙微信小程序V1.0 SayLove -基于微信云开发-一键快速搭建,开箱即用
后续会继续更新,敬请期待2.0全新版本欢迎添加左边的微信一起探讨!项目地址:(https://www.aliyun.com/activity/daily/bestoffer?userCodesskuuw5n)\2.Bug修复更新日历2.情侣脸功能大家不要使用了,现在阿里云的接口已经要收费了(土豪请随意),\\和注意
晴空闲云 晴空闲云
5个月前
css中box-sizing解放盒子实际宽高计算
我们知道传统的盒子模型,如果增加内边距padding和边框border,那么会撑大整个盒子,造成盒子的宽度不好计算,在实务中特别不方便。boxsizing可以设置盒模型的方式,可以很好的设置固定宽高的盒模型。盒子宽高计算假如我们设置如下盒子:宽度和高度均为200px,那么这会这个盒子实际的宽高就都是200px。但是当我们设置这个盒子的边框和内间距的时候,那
Karen110 Karen110
1年前
一篇文章带你了解JavaScript日期
日期对象允许您使用日期(年、月、日、小时、分钟、秒和毫秒)。一、JavaScript的日期格式一个JavaScript日期可以写为一个字符串:ThuFeb02201909:59:51GMT0800(中国标准时间)或者是一个数字:1486000791164写数字的日期,指定的毫秒数自1970年1月1日00:00:00到现在。1\.显示日期使用
艾木酱 艾木酱
5个月前
快速入门|使用MemFire Cloud构建React Native应用程序
MemFireCloud是一款提供云数据库,用户可以创建云数据库,并对数据库进行管理,还可以对数据库进行备份操作。它还提供后端即服务,用户可以在1分钟内新建一个应用,使用自动生成的API和SDK,访问云数据库、对象存储、用户认证与授权等功能,可专
Wesley13 Wesley13
1年前
MySQL查询按照指定规则排序
1.按照指定(单个)字段排序selectfromtable_nameorderiddesc;2.按照指定(多个)字段排序selectfromtable_nameorderiddesc,statusdesc;3.按照指定字段和规则排序selec
helloworld_28799839 helloworld_28799839
5个月前
常用知识整理
Javascript判断对象是否为空jsObject.keys(myObject).length0经常使用的三元运算我们经常遇到处理表格列状态字段如status的时候可以用到vue
helloworld_34035044 helloworld_34035044
8个月前
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为