JavaScript

Numeric Separators in JavaScript

Advertisements

Writing performant code is not enough as a developer. We need to ensure that it is readable as well. And it is rare that an API change in a language introduces readability. Numeric Separators are one such rare change.

Why numeric Separators?

const number = 100000000;
JavaScript

Reading this takes a few seconds:

Counting the number of zeroes is something nobody wants to do. It takes some mental capacity but there was no other way of writing them until now. With numeric separators, we can now use underscores to separate numeric literals.

How?

const number = 100_000_000;
JavaScript

The rules with separators are pretty obvious ones. The number cannot start or end with underscores and there cannot be two consecutive underscores in a literal.

Also, it can be applied to binary, octal and hex numbers too!

const binary = 0b1_0000; // 16
const octal = 0o1_0_0_1; // 513
const hex = 0xA_B_C_0_0; // 703488
JavaScript

It is widely supported as well. IE is the only browser that does not have support. You can see the complete list here.

Let us go and make our numbers easier to read!

Saransh Kataria

Born in Delhi, India, Saransh Kataria is the brain behind Wisdom Geek. Currently, Saransh is a software developer at a reputed firm in Austin, and he likes playing with new technologies to explore different possibilities. He holds an engineering degree in Computer Science. He also shares his passion for sharing knowledge as the community lead at Facebook Developer Circle Delhi, NCR which is a developer community in Delhi, India.

Share
Published by
Saransh Kataria

Recent Posts

How To Get The Hash of A File In Node.js

While working on a project, I wanted to do an integrity check of a file…

1 week ago

Native popover API in HTML

Popovers have been a problem that was typically solved by using a third-party solution. But…

2 weeks ago

Node.js 20.6 adds built-in support for .env files

Node.js 20.6 added built-in support for the .env file. This is an excellent addition to the platform…

3 weeks ago

Object destructuring in TypeScript

Object destructuring is a powerful ES 6 feature that can help developers write cleaner code.…

1 month ago

Improve git clone performance in a CI pipeline

Have you felt particularly annoyed by the time it takes to clone a large repository,…

2 months ago

Fix: Hydration failed because the initial UI does not match what was rendered on the server

Within a React or Next.js app, if you encounter the error "Hydration failed because the…

2 months ago
Advertisements