Les séparateurs numériques en JS
Par Christophe Porteneuve • Publié le 8 juin 2022 • 3 min

Bienvenue dans notre treizième (et avant-dernier…) article de la série JS idiomatique.

Aujourd’hui on fait le point sur une petite syntaxe fort sympathique, mais dont l’arrivée en JS a connu de nombreux obstacles : les séparateurs numériques. Une évolution du langage chère à mon cœur 😉.

Tu préfères une vidéo ?

Si tu es du genre à préférer regarder que lire pour apprendre, on a pensé à toi :

C’est quoi le souci ?

Oh, tu vas tout de suite comprendre :

const TURNS = 10000000000 // 10 millions ? 100 ? 1 milliard ? Plus ?
const MASK = 0b10110110 // 8 bits, plus, moins ? Le 1er quad vaut quoi ?
const FEE = 1500 // 1500 € ? 15 ? 1,5 ? Y’a-t-il une virgule fixe ?
const FLAT_RATE = 250000 // 250 000 ou 2 500 (2 500,00) car en cents ?

Mais désormais la vie est belle

De nombreux langages ont adopté le séparateur numérique _ (underscore) dans leurs littéraux numériques, parfois depuis des lustres. C’est notamment le cas de Java, Python, Perl, Ruby, Rust ou C#, pour ne citer qu’eux.

Note bien que le séparateur ne change strictement rien à la valeur finale, il est juste là pour plus de lisibilité du code source, avec peu ou prou les mêmes contraintes de bon sens que dans les autres langages le proposant :

  • Pas en début ou en fin de littéral (let n = _10_ : non, deux fois non !)
  • Pas en fin de partie entière ni en début de partie flottante ou exposant dans un littéral flottant (let n = 5_._0e_10 : non, non et non !)
  • Pas de séparateurs adjacents (const FEE = 15__00 : non !)
const TURNS = 10_000_000_000 // 10 milliards !
const MASK = 0b1011_0110 // 8 bits, 1er quad = 1011
const FEE = 15_00 // 15,00€, en cents
const FLAT_RATE = 2_500_00 // 2 500, en cents

J’ajoute que ça marche aussi pour les littéraux BigInt (type introduit en ES2020), pour lesquels c’est particulièrement utile.

const MASS_OF_EARTH_IN_KG = 6_000_000_000_000_000_000_000_000n

Ça marche donc pour les littéraux décimaux (entiers et flottants, y compris en notation scientifique), hexadécimaux, binaires et même octaux (déjà moins utile).

Attention quand même…

Afin de Ne Pas Casser Internet™, les fonctions Number (y compris en tant que constructeur), parseInt et parseFloat ne reconnaissent pas ces séparateurs, préservant ainsi la compatibilité ascendante, sacro-sainte en JavaScript.

Pourquoi ça a pris des années, au fait ?

La proposition initiale remonte à mi-2017, pourquoi diable a-t-il fallu attendre quatre ans pour une évolution qui, somme toute, a un impact très mineur sur la syntaxe comme sur la sémantique de la bibliothèque standard ?!

Essentiellement parce qu’à peu près au même moment, une autre proposition, Numeric Literal Suffixes, a vu le jour, qui s’est retrouvée en conflit frontal avec les séparateurs numériques en termes de syntaxe.

Il aura fallu trois ans (jusqu’en septembre 2020) pour que cette dernière finisse par prévaloir, simplement parce qu’elle avait avancé plus vite tout en collaborant au mieux avec l’autre, qui reste au stade 1 du processus de standardisation à l’heure où j’écris ces lignes (et franchement, je doute qu’elle passe un jour au stade 2, le besoin me paraît trop niche).

Enfin, en tout cas, ayé, c’est disponible !

Quels moteurs JS ?

C’est officiel depuis ES2021, mais comme souvent la prise en charge native n’a pas attendu, surtout que la sémantique est bien connue et très facile à intégrer :

  • Tous les navigateurs modernes depuis mi-2020
  • Node 12+

Et pour tout le reste, il y a Babel.

Ça t’a plu ? Ne manque pas la suite !

Il y a plein de sujets merveilleux dans cette série JS idiomatique, et le prochain, c’est du lourd !

Pour être sûr·e de ne rater aucun de nos tutos et articles, le mieux est encore de t’abonner à notre newsletter et à notre chaîne YouTube. Tu peux aussi nous suivre sur Twitter.

Et bien entendu, n’hésite pas à jeter un œil à nos formations ! Si explorer l’intégralité des recoins du langage t’intéresse, la ES Total notamment est faite pour toi !