The numeric separator (_) translates this sentence into English.

ECMAScript 12 (ES2021) introduced the numeric separator (_) feature, allowing developers to use underscores as visual separators in numeric literals to improve readability. This feature is particularly useful when working with large numbers or complex numeric structures.

Basic Syntax of Numeric Separators

Numeric separators allow underscores (_) to be inserted into numeric literals to group digits without changing the actual value of the number. Separators can appear in the integer part, fractional part, exponent part, or numbers in different bases (e.g., binary, octal, hexadecimal).

// Integer separation
const billion = 1_000_000_000; // Equivalent to 1000000000

// Decimal separation
const pi = 3.141_592_653_589; // Equivalent to 3.141592653589

// Binary separation
const binary = 0b1010_0001_1000; // Equivalent to 0b101000011000

// Hexadecimal separation
const hex = 0xA1_B2_C3; // Equivalent to 0xA1B2C3

// Exponential separation
const scientific = 1.602_176_634e-19; // Equivalent to 1.602176634e-19

Rules for Using Separators

The use of numeric separators follows these rules:

1. Cannot use multiple consecutive separators: For example, 1__000 is invalid.
2. Cannot appear at the start or end of a number: For example, _100 or 100_ is invalid.
3. Cannot appear before or after non-numeric characters: For example, 0x_123 or 123_.456 is invalid.
4. Does not affect the actual value of the number: Separators are only for visual grouping and are ignored during parsing.

// Examples of invalid usage
const invalid1 = _100;     // SyntaxError
const invalid2 = 100_;     // SyntaxError
const invalid3 = 1__000;   // SyntaxError
const invalid4 = 0x_123;   // SyntaxError
const invalid5 = 123_.456; // SyntaxError

Practical Use Cases

Numeric separators are especially useful in the following scenarios:

Improving Readability of Large Numbers

When dealing with large numbers in finance, scientific calculations, or game development, separators can significantly enhance code readability.

// Financial amounts
const revenue = 1_234_567_890; // Clearer than 1234567890

// In-game currency
const goldCoins = 999_999_999;

// Scientific constants
const avogadro = 6.022_140_76e23;

Grouping Binary and Hexadecimal Data

When working with binary data or color values, separators can help quickly identify segments.

// Binary data grouping
const permissions = 0b111_101_101; // Equivalent to 0b111101101

// RGB color values
const red = 0xFF_00_00;
const green = 0x00_FF_00;
const blue = 0x00_00_FF;

Adapting to International Number Formats

Different regions have different conventions for grouping numbers (e.g., thousands, ten-thousands). Separators can flexibly adapt to these conventions.

// Chinese convention (grouped every 4 digits)
const chineseFormat = 1_0000_0000;

// English convention (grouped every 3 digits)
const englishFormat = 100_000_000;

Interaction with Other Syntax

Numeric separators can be combined with other ES features, such as template literals and BigInt.

// Numeric separators in template literals
console.log(`The value is ${1_000_000}`); // Outputs "The value is 1000000"

// Using separators with BigInt
const bigInt = 9_007_199_254_740_991n;

Notes

1. Type Conversion: When a number with separators is converted to a string, the separators are ignored.

   String(1_000); // "1000"
   

2. JSON Does Not Support It: The JSON specification does not allow numeric separators, and parsing will result in an error.

   JSON.parse('{"value": 1_000}'); // SyntaxError
   

3. Compatibility with Older Environments: Ensure the runtime environment supports ES2021 or use Babel for transpilation.