BigInt

BigInt is a special number type that provides support for arbitrarily long integers.

There are two ways to create bigInt: by adding n to an integer literal or by calling the bigint function, which generates BigInt from strings, numbers, and so on.

const bigint = 1234567890123456789012345678901234567890n;

const sameBigint = BigInt("1234567890123456789012345678901234567890");

const bigintFromNumber = BigInt(10); // Same as 10n
Copy the code

Mathematical operator

BigInt can be used mostly like a regular numeric type, for example:

alert(1n + 2n); / / 3

alert(5n / 2n); / / 2
Copy the code

Note that the result of division 5/2 is rounded to zero and the rounded result has no decimal part. All operations on bigInt return bigInt.

We cannot mix bigint with regular numeric types:

alert(1n + 2); // Error: Cannot mix BigInt and other types
Copy the code

If necessary, we should convert them explicitly: use BigInt() or Number(), like this:

let bigint = 1n; let number = 2; // Convert number to bigInt alert(bigint + bigint (number)); // set bigint to number alert(number (bigint) + number); / / 3Copy the code

Conversion operations are always silent and never fail, but if BigInt is too large for the numeric type to accommodate, the excess bits will be truncated, so we should be careful with such conversions.

BigInt does not support unary addition

The unary addition operator +value is a well-known method of converting a value to a numeric type.

To avoid confusion, unary addition is not supported in Bigint:

let bigint = 1n;

alert( +bigint ); // error
Copy the code

So we should use Number() to convert a Bigint to a numeric type.

Comparison operator

Comparison operators, such as < and >, have no problem using them to compare numbers of type Bigint and number:

alert( 2n > 1n ); // true

alert( 2n > 1 ); // true
Copy the code

Note, however, that since number and Bigint are of different types, they may be equal when comparing ==, but not equal when comparing === (strictly equal) :

alert( 1= =1n ); // true

alert( 1= = =1n ); // false
Copy the code

Boolean operation

Bigint behaves like number when in an if or other Boolean operation.

For example, in if, bigint 0n is false and other values are true:

if (0n) {
  // Never execute
}
Copy the code

Boolean operator, for example, | |, && and other operators, and treatment of bigint also similar to the number:

alert( 1n || 2 ); // 1 (1n is considered true)

alert( 0n || 2 ); // 2 (0n is considered false)
Copy the code

Polyfill

Polyfilling Bigint is tricky. The reason is that many JavaScript operators, such as + and -, treat BigInt differently than regular number.

For example, the division of Bigint always returns Bigint (rounding if necessary).

To simulate this behavior, Polyfill needs to analyze the code and replace all such operators with its functions. But doing so is cumbersome and costly in performance.

Therefore, there is no known polyfill that works well.

However, the developers of the JSBI library have come up with another solution.

The library implements large numbers in its own way. We can use them instead of native Bigint:

… Then, for those browsers that support BigInt, you can use Polyfill (the Babel plug-in) to convert JSBI calls to native BigInt.

In other words, this method suggests that we use JSBI instead of native BigInt when writing code. But JSBI internally uses number as bigInt and emulates it to the best of its specifications, so the code is ready for BigInt.

For engines that don’t support BigInt, we can use this kind of JSBI code “as-is”, and for those that do – Polyfill will convert the call to native BigInt.

reference

• The MDN documentation describes BigInt.
• ECMA262 specification.

Modern JavaScript Tutorials: Open source modern JavaScript tutorials from beginner to advanced quality. React provides a JavaScript tutorial for MDN learners.

Read for free online: zh.javascript.info

Scan code on wechat to follow the public account “Technology Talk” and subscribe to more exciting content:

• LeetCode algorithm problem solving
• JavaScript getting started to advanced
• Front-end projects go from zero to one
• Front end learning method route sharing
• …