JavaScript Numeric Separators

By  on  

Writing good code is important -- writing code that's easily human readable is a next level skill. It's not often that APIs are introduced whose seemingly only useful function is making code more readable, but let me introduce you to JavaScript numeric separators: an API that lets developers use underscores to make numbers more readable!

Consider the following number in your code:

// No commas for numbers in JavaScript
const oneHundredThousand = 100000;

Large numbers have always been difficult to mentally parse for engineers, so using underscores to make code more readable is a total win:

const oneMillion = 1_000_000; // 1000000
const decimals = 1_000_00.01_02_03 // 100000.010203

The only real rule with numeric separators is that the number cannot start or end with an underscore.

Numeric separators within JavaScript seem like spec creators gifting developers a feature. As an engineer, I'll take all I can get. You never stop learning in the world of JavaScript!

Recent Features

  • By
    I’m an Impostor

    This is the hardest thing I've ever had to write, much less admit to myself.  I've written resignation letters from jobs I've loved, I've ended relationships, I've failed at a host of tasks, and let myself down in my life.  All of those feelings were very...

  • By
    Chris Coyier’s Favorite CodePen Demos

    David asked me if I'd be up for a guest post picking out some of my favorite Pens from CodePen. A daunting task! There are so many! I managed to pick a few though that have blown me away over the past few months. If you...

Incredible Demos

  • By
    MooTools Equal Heights Plugin:  Equalizer

    Keeping equal heights between elements within the same container can be hugely important for the sake of a pretty page. Unfortunately sometimes keeping columns the same height can't be done with CSS -- you need a little help from your JavaScript friends. Well...now you're...

  • By
    CSS @supports

    Feature detection via JavaScript is a client side best practice and for all the right reasons, but unfortunately that same functionality hasn't been available within CSS.  What we end up doing is repeating the same properties multiple times with each browser prefix.  Yuck.  Another thing we...

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!