JSON结果展示时no字段值异常的原因及解决方法咨询

这个问题我之前也碰到过，其实是JavaScript里Number类型的精度限制在搞鬼！

问题原因 #

JavaScript的Number类型采用的是64位双精度浮点数，它能精确表示的整数范围是从-2^53到2^53（也就是-9007199254740992到9007199254740992）。你提到的数字35797506102858582已经超出了这个范围，所以JavaScript无法精确存储它，会自动将其转换为最接近的可表示浮点数，也就是你看到的35797506102858584。

不光是编辑器，只要是用原生JavaScript处理这个JSON，都会出现这个精度丢失的问题。

解决办法 #

这里有几个可行的方案，你可以根据实际情况选择：

1. 后端修改返回格式（推荐） #

最根本的解决方式是让WebAPI把no字段的值以字符串类型返回，而不是数字类型。比如返回的JSON改成：

[{ "id": 1, "name": "TEST 1", "no": "35797506102858582" }]

这样前端拿到的是字符串，不会被JavaScript自动转成Number，自然就不会丢失精度了。

2. 前端用特殊方式解析JSON #

如果后端没法修改，前端可以通过以下方式处理：

• 使用JSON.parse的reviver函数，手动将no字段转为字符串：

const jsonStr = '[{ "id": 1, "name": "TEST 1", "no": 35797506102858582 }]';
const data = JSON.parse(jsonStr, (key, value) => {
  if (key === 'no') return value.toString();
  return value;
});

• 使用第三方库（比如json-bigint）来解析JSON，它会自动将超出精度的数字转为BigInt类型：

const JSONbig = require('json-bigint');
const data = JSONbig.parse(jsonStr);
// 后续使用时可以转成字符串：data[0].no.toString()

3. 针对编辑器显示的问题 #

如果你只是在类似JSON编辑器里想正确查看，只要后端返回字符串格式的no，编辑器就能准确显示原始值了。

内容的提问来源于stack exchange，提问作者stackCoder