JavaScript Numeric Separators were introduced in ECMAScript 2021 (ES12) to make large numbers easier to read and understand by adding underscores (_) as separators. This is particularly useful when dealing with large numbers like credit card numbers, IDs, or any numerical values that involve a lot of digits. The numeric separator has no effect on the numeric value itself; it’s purely for readability.
Table of Contents
1. Basic Usage of Numeric Separators
The numeric separator (_) can be inserted within numbers (integers, floating-point, hexadecimal, binary, or octal numbers) to improve readability. It cannot be placed at the beginning, end, or immediately before or after a decimal point.
Example 1: Using Numeric Separators with Large Numbers
let billion = 1_000_000_000; console.log(billion); // Output: 1000000000
Explanation
The number 1_000_000_000 is easier to read compared to 1000000000 because of the underscores.
The underscores do not affect the numeric value; 1_000_000_000 is still interpreted as 1000000000.
2. Using Numeric Separators with Different Number Formats
Example 2: Floating-point Numbers
let price = 12_345.67_89; console.log(price); // Output: 12345.6789
Explanation
You can use numeric separators in both the integer part (12_345) and the fractional part (67_89) of a floating-point number.
The output remains 12345.6789; the underscores are just for readability.
Example 3: Binary, Octal, and Hexadecimal Numbers
Numeric separators can also be used with binary (0b), octal (0o), and hexadecimal (0x) literals.
// Binary let binaryNumber = 0b1010_1010_1010; console.log(binaryNumber); // Output: 2730 // Octal let octalNumber = 0o1234_5670; console.log(octalNumber); // Output: 3422784 // Hexadecimal let hexNumber = 0xAB_CD_EF_01; console.log(hexNumber); // Output: 2882400001
Explanation
Binary: 0b1010_1010_1010 is equivalent to 0b101010101010.
Octal: 0o1234_5670 is equivalent to 0o12345670.
Hexadecimal: 0xAB_CD_EF_01 is equivalent to 0xABCDEF01.
3. Incorrect Usage of Numeric Separators
The numeric separator cannot be used in certain positions. Let's look at some incorrect usages that will cause syntax errors.
Example 4: Invalid Placements
// Invalid: Leading or trailing separator // let number1 = _1000; // SyntaxError // let number2 = 1000_; // SyntaxError // Invalid: Consecutive separators // let number3 = 1__000; // SyntaxError // Invalid: Adjacent to the decimal point // let number4 = 1000_.00; // SyntaxError // let number5 = 1000._00; // SyntaxError
Explanation
You cannot place numeric separators at the beginning or end of a number (_1000, 1000_).
Consecutive separators (1__000) are not allowed.
Numeric separators cannot be directly adjacent to the decimal point (1000_.00 or 1000._00).
4. Real-world Use Cases
Numeric separators are especially useful in scenarios involving large numbers, like credit card numbers, population counts, or scientific values.
Example 5: Population Count
let worldPopulation = 7_800_000_000; // 7.8 billion console.log(worldPopulation); // Output: 7800000000
Explanation
7_800_000_000 is much easier to read and understand as 7.8 billion compared to 7800000000.
Example 6: Currency Representation
let salary = 50_000.00;
console.log(`Your annual salary is $${salary}`); // Output: Your annual salary is $50000.00
Explanation
Using numeric separators in currency amounts like 50_000.00 makes the number more readable, especially in financial applications.
Example 7: Long Numbers for Identification
let creditCardNumber = 1234_5678_9012_3456; console.log(creditCardNumber); // Output: 1234567890123456
Explanation
The credit card number is easier to read when separated into chunks (1234_5678_9012_3456), resembling the format commonly used on cards.
5. Working with Numeric Separators in JavaScript Operations
Numeric separators have no impact on numerical operations. JavaScript treats these numbers exactly the same as if there were no separators.
Example 8: Mathematical Operations
let largeNumber1 = 1_000_000; let largeNumber2 = 2_500_000; let sum = largeNumber1 + largeNumber2; console.log(sum); // Output: 3500000
Explanation
The numeric separators do not interfere with the addition. The values are treated as normal numbers.
Summary
JavaScript numeric separators (_) make working with large numbers easier and improve code readability. Here’s a quick overview:
Correct Usage: Use numeric separators to improve readability of large numbers, floating-point numbers, binary, octal, and hexadecimal literals.
Incorrect Usage: Numeric separators cannot be at the beginning or end of a number, adjacent to a decimal point, or used consecutively.
No Impact on Operations: Numeric separators do not affect the numeric value; they are purely for the programmer’s convenience.
Key Points
Example Correct Usage:
1_000_000: One million.
3.1415_9265_3589: A readable representation of pi.
0xAB_CD_EF: A hexadecimal value.
Example Incorrect Usage:
_1000, 1000_, 1__000, 1000_.00: These will result in syntax errors.
By using numeric separators, you can make your JavaScript code involving large numbers more maintainable and easier to read.