DEV Community

Cover image for Numeric Separators in JavaScript
Joby Joseph
Joby Joseph

Posted on • Originally published at backbencher.dev

Numeric Separators in JavaScript

Numeric separator(_) was introduced to make numbers more readable by creating a visual separation between groups of digits. The separator can be used with decimal, binary, hexadecimal or BigInt numbers. This feature was introduced in ES12.

It is difficult for humans to read large numbers quickly. What about 1000000000? Is it a billion or 10 million?. Numeric separators make developers' life easy.

const num = 1000_000_000; // Definitely a billion
Enter fullscreen mode Exit fullscreen mode

Numeric separator is purely for visual separation. It does not have any impact in the functionality. In fact, comparing a number with separator and that without it, results in true.

console.log(1000_000_000 === 1000000000); // true
Enter fullscreen mode Exit fullscreen mode

Position of Separator

The numeric separator can appear anywhere inside the number. Following are valid usages of numeric separators.

1000_000_000
123_02
4567_00
3_4_5_6
Enter fullscreen mode Exit fullscreen mode

Numeric separator is not allowed at the end of a number. Therefore, following number is invalid.

123_00_
Enter fullscreen mode Exit fullscreen mode

Also, if a number starts with _, JavaScript treats it as a variable. In JavaScript, a variable can start with _.

const a = _123;
Enter fullscreen mode Exit fullscreen mode

Here _123 is considered as a variable name. Since that variable is not declared, above code will throw reference error.

Separators in Fractional Part

Numeric separators can be placed in the fractional part of a number.

12.300_00
1e10_10
Enter fullscreen mode Exit fullscreen mode

Examples

Here are some examples that consider different use cases of numeric separator.

Binary Literal

A binary literal in JavaScript is denoted by prefixing a binary number by 0b. While writing a binary literal, we can place numeric separator to make it more readable.

console.log(0b11_1); // 7
console.log(0b111); // 7
Enter fullscreen mode Exit fullscreen mode

111 is the binary equivalent of decimal number 7.

Hex Literal

A Hexadecimal literal in JavaScript is denoted by prefixing a hexadecimal number by 0x. We can include numeric separator in a hexadecimal number.

console.log(0xF_F); // 255
console.log(0xA_B === 0xAB); // true
Enter fullscreen mode Exit fullscreen mode

Note that the decimal equivalent of 0xFF is 255.

BigInt Literal

A BigInt literal can contain a numeric separator.

const a = 1_309_89n;
console.log(typeof a); // "bigint"
console.log(a.toString()); // "130989"
Enter fullscreen mode Exit fullscreen mode

If we place an underscore _ between the number and final n, it will throw an error.

const a = 1_309_89_n;
Enter fullscreen mode Exit fullscreen mode

Above code results in following error:

SyntaxError: Numeric separators are not allowed at the end of numeric literals
Enter fullscreen mode Exit fullscreen mode

Browser Compatibility

All the major browsers support numeric separators. We can see the precise information by visiting this CanIuse link.

Top comments (0)