其實我不知道Biglnt的中文可以叫什麼比較好，直接翻成「大整數」似乎不太精確。

今天會從以下這些角度來介紹：

  1. Biglnt為何而來
  2. 定義及如何使用
  3. 可能會踩的雷區

數字類型 => Biglnt跟Number

在JavaScript中，Biglnt也是其中的一種primitive，也就是基本型別。

複習一些有哪些基本型別，基本上可以由字串、數字、布林值含括：

  • String
  • Number
  • Boolean
  • Null
  • Undefined
  • Symbol

除了這些，其實還有一種基本型別叫做Biglnt，也是用來處裡數字的部分，就跟Number一樣的領域。

主要是因為光是Number處理數字會有一些無法顧及到的部分，所以才有了需要Biglnt的誕生。

舉例來說，只要數字太大，Number就沒辦法顯示精準，而這個範圍大致是2**53-1，從Number.MAX_SAFE_INTEGER裡面描述的最大安全整數範圍來判斷，也就是說超過了這個數字，Number就沒辦法維持準確性。

不精確的意思是代表說明明兩個不一樣，但判斷不出來，舉一個例子是在JavaScript當中的2 ** 53 + 1 跟2 ** 53 會一樣，非常奇怪。

1
2
3
4
5
6
7
8
const A = 2 ** 53 + 1;
const B = 2 ** 53;

console.log(A, B);
// 9007199254740992 9007199254740992

console.log(A === B);
// true

為了要解決這個問題，JavaScript才會需要可以支持任意長度整數都保持精確度的Biglnt。

創建 Biglnt 方式

把數字變成Biglnt的狀態很簡單，有兩種做法：

  1. 在數字後面直接加上 n
  2. 使用 BigInt()

就是字面上的意思，加上一個 n 跟把數字給()起來。

1
2
3
const number = 123;
const bigInt1 = 123n;
const bigInt2 = BigInt(123); //跟bigInt1一模一樣

跟Number一樣可以使用各種的運算子，可以把Biglnt當作一個後綴加上了n的Number。

1
2
3
4
5
6
7
console.log(1n + 1n); // 2n
console.log(2n * 2n); // 4n
console.log(10n / 2n); // 5n
console.log(50n % 10n); // 0n

console.log(10n > 5n); // true
console.log(20n > 30n); // false

跟Number有一個不一樣的地方，一般來說當只寫出值，像是10，那它可能是String也可能是Number，而這時候可以使用在這個值前面加上一個+的方式，讓這個值確認變為是Number型別。

1
console.log(typeof +10); //number

但在Biglnt不支援這種方式，可能是為了避免搞混，如果在Biglnt就會直接報錯給你看。

1
console.log(+10n); // TypeError

**什麼時候使用Biglnt**？

值超過了最大安全數字的時候，就是值大於2^53再使用Biglnt，正常狀態下好好的可以繼續用Number沒問題。

Biglnt 踩雷區域

以下問題都知道的話就可以直接跳過囉。

  • BigInt可以跟其他常規數字混合使用嗎？
  • BigInt跟Number一直切換是好是壞？

直接講結論，沒辦法混合使用，BigInt跟Number加再一起送你報錯。

1
2
3
console.log(1 + 1); // 2
console.log(1n + 1n); // 2n
console.log(1n + 1); // TypeError

如果有需要兩者的狀況，應該是要想法把轉換他們，有兩種情況：

  1. 將number轉換成bigint
1
console.log(10n + BigInt(10)); // 20n
  1. 將bigint轉換成number
1
console.log(Number(10n) + 10); // 20

而BigInt跟Number一直切換好嗎？
MDN 文件裡面說這樣不好，不建議在BigInt值和Number值之間進行強制轉換。

因為Number值和BigInt值之間的強制轉換會導致精度損失。

總結

Biglnt是一個新的數字基本型別,用來處理一些Number沒有辦法處理的數字，像是Number能夠表示的安全整數範圍之外的，就只能夠靠Biglnt來精準顯示。

reference

[1] MDN - BigInt
[2] JavaScript 之旅 (22)：BigInt
[3] w3schools - ECMAScript 2020