JSON.parse() 中 reviver参数的理解

最新推荐文章于 2025-04-17 17:55:08 发布

摸鱼仔某人

最新推荐文章于 2025-04-17 17:55:08 发布

阅读量1.5k

点赞数 3

文章标签： json

本文链接：https://blog.csdn.net/ahead_he/article/details/121999123

版权

本文探讨了JSON.parse()中reviver参数的作用，通过一个例子解释了如何使用reviver来转换解析后的值。当reviver函数返回undefined时，相应属性会被删除。根据MDN的描述，reviver函数的执行顺序类似于事件的捕获和冒泡阶段，从最内层属性向外层遍历。对于给定的JSON字符串，文章详细描述了这一过程，展示了如何逐层处理属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天在去了解 JSON.parse() 中 reviver参数时发现了中有一个例子很有意思。
例子如下：

JSON.parse('{"p": 5}', (key, value) =>
  typeof value === 'number'
    ? value * 2 // 为数字时返回值*2
    : value     // 其他不变
);

// { p: 10 }

JSON.parse('{"1": 1, "2": 2, "3": {"4": 4, "5": {"6": 6}}}', (key, value) => {
  console.log(key); // 记录当前属性名，最后一个为""
  return value;     // 返回未改变的属性值
});

// 1
// 2
// 4
// 6
// 5
// 3
// ""

看看 MDN 对 reviver 参数的定义：

如果 reviver 指定了a ，则解析计算的值会在返回之前进行转换。具体来说，计算出的值及其所有属性（从嵌套最多的属性开始并继续到原始值本身）分别通过 reviver . 然后它被调用，包含被处理的属性的对象 this ，属性名称作为字符串，属性值作为参数。如果 reviver 函数返回 undefined （或不返回任何值，例如，如果执行在函数结束后中断），则该属性将从对象中删除。否则，该属性将被重新定义为返回值。

如果 reviver only 转换某些值而不转换其他值，请确保按原样返回所有未转换的值，否则，它们将从结果对象中删除。

第一个例子很好理解：

JSON.parse('{"p": 5}', (key, value) =>
  typeof value === 'number'
    ? value * 2 // 为数字时返回值*2
    : value     // 其他不变
);

// { p: 10 }

去判断 JOSN.parse 中第一个参数是否为数字，如果是数字的话返回值要 *2 ，否则不变。

因此 p 的值改变，输出结果为10

但是到第二个例子时，前边还好理解，后边突然就感觉不太好，一起看看：

JSON.parse('{"1": 1, "2": 2, "3": {"4": 4, "5": {"6": 6}}}', (key, value) => {
  console.log(key); // 记录当前属性名，最后一个为""
  return value;     // 返回未改变的属性值
});

// 1
// 2
// 4
// 6
// 5
// 3
// ""

MDN 上说 reviver 属性是从嵌套最多的属性开始并继续到原始值本身。

个人理解相当于先进行捕获事件再进行冒泡事件，一层一层，层层嵌套。

在当前 JSON.parse 传入的 text 为 string 类型的一长串：'{"1": 1, "2": 2, "3": {"4": 4, "5": {"6": 6}}}'