JavaScript的JSON.stringify()

发表于 分类于 阅读次数： Valine：

原文：JSON.stringify() in JavaScript

JSON.stringify()函数是JavaScript对象转JSON字符串最常见的方法。本文从实用的角度、以示例说明JSON.stringify()。

JSON.stringify()函数主要用于JavaScript对象转JSON字符串。几乎每个操作HTTP请求和响应的npm包，例如axios或express，都会在内部使用JSON.stringify()。

JSON转换

JSON.stringify()的第一个参数是要转换为JSON的值。

1
2
3
4
5
6
7
const obj = { answer: 42 };
const arr = ['hello', 'world'];

typeof JSON.stringify(obj); // 'string'

JSON.stringify(obj); // '{"answer":42}'
JSON.stringify(arr); // '["hello","world"]'

JSON只能表示以下类型的值：

  • Strings
  • Numbers
  • Objects
  • Arrays
  • Booleans
  • null

读者可能注意到了列表中不包括一些JavaScript的内置类型。确切的说，JSON不能表示JavaScript的undefined、Symbol和BigInt。JSON.stringify()会忽略undefined和Symbol类型的值，而不报错。

1
2
3
4
let obj = { undef: undefined, symbol: Symbol('foo') };

// JSON.stringify() 忽略 `undefined` 和 `Symbol`
JSON.stringify(obj); // '{}'

JSON.stringify()如果发现BigInt值会抛出异常。

1
2
// TypeError: Do not know how to serialize a BigInt
JSON.stringify({ val: 42n });

列表中也不包括一些JavaScript对象，例如日期类型。JSON.stringify()函数会将日期转换为字符串。

1
2
// '{"date":"2019-06-01T00:00:00.000Z"}'
JSON.stringify({ date: new Date('2019-06-01') });

替换函数

JSON.stringify()的第二个参数是替换函数。JavaScript为对象中的每个键值对调用该函数，并以返回值作为值进行处理。如果替换函数返回了undefined，JSON输出将不包含这个key。

例如，要用替换函数去掉null值：

1
2
3
4
5
6
7
8
const obj = { answer: 42, test: null };
// '{"answer":42}'
JSON.stringify(obj, function replacer(key, value) {
  if (value === null) {
    return undefined;
  }
  return value;
});

美化格式

JSON.stringify()的第三个参数是缩进符。该参数是一个字符串或数值，JavaScript会按参数将JSON输出为人类可读的格式。如果指定了缩进符，JavaScript会把每个键值对单独一行，并在每一行用缩进符进行缩进。

1
2
3
4
5
6
7
8
const obj = { firstName: 'Jean-Luc', lastName: 'Picard' };
// {
//   "firstName": "Jean-Luc",
//   "lastName": "Picard"
// }
JSON.stringify(obj, null, '  ');
// 等效，JavaScript认为 `2` 等价于 2 个空格。
JSON.stringify(obj, null, 2);