我的朋友 Lily 已經(jīng)工作了 5 年，她過去一直擔(dān)任前端工程師。

不幸的是，她被老板批評(píng)了，因?yàn)樗诠ぷ髦蟹噶艘粋€(gè)錯(cuò)誤，這是一個(gè)非常簡單但容易忽視的問題，我想也是很多朋友容易忽視的一個(gè)問題，今天我把它分享出來，希望能夠幫助到你，也希望大家遇到這個(gè)情況時(shí)，不要再放這個(gè)錯(cuò)誤。

錯(cuò)誤的描述

問題可能是這樣的，Lily在公司負(fù)責(zé)一個(gè)重大項(xiàng)目，其中一個(gè)模塊是顯示一條與數(shù)字相關(guān)的信息，這是后端工程師界面返回的信息（僅舉例）。

@RestController
@RequestMapping("/getInfo")
public class YupiTestController {
  @GetMapping
  public Long getNum() {
    return 123456789123456789L;
  }   
}

各位小伙伴，我們調(diào)用getInfo接口會(huì)返回什么信息呢？會(huì)是 123456789123456789 嗎？

通過chrome瀏覽器的調(diào)試工具可以看到，似乎一切都和我們想象的一樣，結(jié)果是123456789123456789。

但是，頁面顯示的結(jié)果是123456789123456780，最后一位是0而不是9。

這到底是怎么回事？這太奇怪了，是不是有點(diǎn)崩潰。

分析出現(xiàn)問題的原因

現(xiàn)在，我們一起來分析一下原因。

我嘗試分析返回的數(shù)字，發(fā)現(xiàn)只有當(dāng)數(shù)字超過16位時(shí)才會(huì)出現(xiàn)最后幾位不一致的問題。

是不是因?yàn)閿?shù)字太大，出現(xiàn)了精度損失？

Java語言中的Long類型是64位的，JavaScript語言中的Long類型是小于64位的嗎？

天哪，JavaScript 似乎沒有 Long 類型的數(shù)據(jù)！

實(shí)際上，在 JavaScript 中，我們使用 Number 來表示類型 number 的值。

Number 類型的總長度為 64 位。 64位大致就是這樣分配的，其中53位代表小數(shù)位，10位代表指數(shù)位，1位代表符號(hào)位。因此，Number 整數(shù)的表示范圍為 -2^53 ~ 2^53。

讓我們嘗試在控制臺(tái)上輸出 JavaScript 中的最大值和最小值。

在其他語言中，例如 Java，Long 類型占用 64 個(gè)二進(jìn)制位，最大值為 9223372036854774807 (2?3 — 1)，長度約為 19 位。

在 JavaScript 中，由于 Number 類型的值也包含小數(shù)，所以最大值為 9007199254740993 (2^53 - 1)，長度約為 16 位。

所以當(dāng)Java向JSON返回16位以上的Long類型字段時(shí)，前端JavaScript獲取的數(shù)據(jù)會(huì)因?yàn)橐绯龆ゾ取?/p>

如何解決這個(gè)問題呢？

也許我們可以嘗試在前端解決這個(gè)問題，但我認(rèn)為我們應(yīng)該尋求后端工程師的幫助。

我們應(yīng)該將可能超出范圍的數(shù)字類型（Long）變量轉(zhuǎn)換為字符串類型（String）。這個(gè)是我的個(gè)人處理方法，如果你有更好的解決方案，也請(qǐng)歡迎你在留言區(qū)跟我一起來分享討論，讓我們大家一起學(xué)習(xí)進(jìn)步。

最后總結(jié)

其實(shí)，在實(shí)際編程中，什么樣的情況都有可能發(fā)生，但是不管怎么樣，只要我們認(rèn)真分析問題，積極找解決方法，問題肯定可以解決，在此，也希望今天分享的這個(gè)問題對(duì)你有所幫助，如果你覺得有用的話，請(qǐng)點(diǎn)贊我，關(guān)注我，并將這篇文章分享給你的開發(fā)者朋友，也許能夠幫助到他。

最后，感謝你的閱讀，祝編程愉快。