解决 JavaScript Number 精度问题：处理超大 Long 类型 ID

在前后端交互中，常常需要传递 Long 类型的 ID。但 JavaScript 的 Number 类型基于 IEEE 754 标准，最大只能精确表示 15 到 17 位的整数，超过这个范围会丢失精度。为了避免这种问题，本文介绍如何处理超大数字。

问题描述

JavaScript 的 Number 类型的最大安全整数是 9007199254740991，超过这个值的数字会出现精度丢失。例如，1234567890123456789 会被转为 1234567890123456700，导致错误。

问题的根源

Long 类型是许多后端语言（如 Java）用于表示大整数的类型，而 JavaScript 的 Number 类型不能正确表示如此大的数字。

ini 复制代码

// 后端：Java
Long longId = 1234567890123456789L;

前端接收到该 ID 后，会出现精度丢失：

javascript 复制代码

// 前端：JavaScript
let itemId = 1234567890123456789;  // 错误，精度丢失
console.log(itemId);  // 输出：1234567890123456700

解决方案

将 Long 类型 ID 转为字符串，并确保前后端都使用字符串形式传递 ID，避免精度丢失。

后台：将 Long 类型 ID 转为字符串。
前端：接收 ID 时保持字符串类型，避免转换为 Number。

实施方案

后端（Java 示例）：

less 复制代码

@RestController
public class ItemController {
    @GetMapping("/items/{id}")
    public ResponseEntity<ItemVO> getItem(@PathVariable Long id) {
        Item item = itemService.getItemById(id);

        ItemVO itemVO = new ItemVO();
        itemVO.setId(String.valueOf(id));

        return ResponseEntity.ok(itemVO);
    }
}

前端（JavaScript 示例）：

javascript 复制代码

// 使用 axios 请求 API
axios.get('/api/items/1234567890123456789')
  .then(response => {
    const itemId = response.data.id;  // 保持为字符串
    console.log(itemId);  // 输出原始字符串
  })
  .catch(error => {
    console.error('Error:', error);
  });