首先说一下为什么写这篇文章，第一个是确实JSON.stringify()是有很多坑的。 还有再一个前两天写了一篇关于JSON.stringify()文章：

挺受欢迎的于是想再写一篇

在本文中，我们将探讨与JSON.stringify()相关的各种坑。

1. 处理undefined、Function和Symbol值

在前端中 undefined、Function和Symbol值不是有效的JSON值。在转换过程中遇到它们时，它们会被省略（在对象中），或者被更改为null（在数组中）。

例如：

const obj = { foo: function() {}, bar: undefined, baz: Symbol('example') };  
const jsonString = JSON.stringify(obj);  
console.log(jsonString); // 输出: '{}'  
  
const obj2 = {arr: [function(){}]};  
console.log(JSON.stringify(obj2)); // 输出: {"arr":[null]}

2. 布尔、数字和字符串对象

布尔、数字和字符串对象在字符串化过程中会被转换为它们对应的原始值。

const boolObj = new Boolean(true);  
const jsonString = JSON.stringify(boolObj);  
console.log(jsonString); // 输出: 'true'

3. 忽略Symbol键的属性

Symbol键属性在字符串化过程中完全被忽略，即使使用替换函数也是如此。这意味着与Symbol键关联的任何数据都将在生成的JSON字符串中被排除。

const obj = { [Symbol('example')]: 'value' };  
const jsonString = JSON.stringify(obj);  
console.log(jsonString); // 输出: '{}'  
  
const obj2 = {[Symbol('example')]: [function(){}]};  
console.log(JSON.stringify(obj2)); // 输出 '{}'

4. 处理无穷大（Infinity）、NaN和Null值

Infinity、NaN 和 null 值在字符串化过程中都被视为 null。

const obj = { value: Infinity, error: NaN, nothing: null };  
const jsonString = JSON.stringify(obj);  
console.log(jsonString); // 输出: '{"value":null,"error":null,"nothing":null}'

5. Date对象被视为字符串

Date实例通过实现toJSON()函数来返回一个字符串（与date.toISOString()相同），因此在字符串化过程中被视为字符串。

const dateObj = new Date();
const jsonString = JSON.stringify(dateObj);
console.log(jsonString); // 输出："2024-01-31T09:42:00.179Z"

6. 循环引用异常

如果 JSON.stringify() 遇到具有循环引用的对象，它会抛出一个错误。循环引用发生在一个对象在循环中引用自身的情况下。

const circularObj = { self: null };
circularObj.self = circularObj;
JSON.stringify(circularObj); // Uncaught TypeError: Converting circular structure to JSON

7. BigInt转换错误

使用JSON.stringify（）转换BigInt类型的值时引发错误。

const bigIntValue = BigInt(42);  
JSON.stringify(bigIntValue); // Uncaught TypeError: Do not know how to serialize a BigInt

各位同学如果在开发中还遇到过不一样的坑，还请评论区补充互相讨论

点赞收藏支持、手留余香、与有荣焉，动动你发财的小手哟，感谢各位大佬能留下您的足迹。

往期热门精彩推荐

面试相关热门推荐

实战开发相关推荐

移动端相关推荐

Git 相关推荐