Search code examples
javascriptlocalizationinternationalization

Is there a way to reverse the formatting by Intl.NumberFormat in JavaScript


The Intl.NumberFormat (see Mozilla's doc) provides a nice way in Javascript to format numbers into a current locale`s version like this:

new Intl.NumberFormat().format(3400); // returns "3.400" for German locale

But I couldn't find a way to reverse this formatting. Is there something like

new Intl.NumberFormat().unformat("3.400"); // returns 3400 for German locale

Thanks for any help.


Solution

  • I have found a workaround:

    /**
     * Parse a localized number to a float.
     * @param {string} stringNumber - the localized number
     * @param {string} locale - [optional] the locale that the number is represented in. Omit this parameter to use the current locale.
     */
    function parseLocaleNumber(stringNumber, locale) {
        var thousandSeparator = Intl.NumberFormat(locale).format(11111).replace(/\p{Number}/gu, '');
        var decimalSeparator = Intl.NumberFormat(locale).format(1.1).replace(/\p{Number}/gu, '');
    
        return parseFloat(stringNumber
            .replace(new RegExp('\\' + thousandSeparator, 'g'), '')
            .replace(new RegExp('\\' + decimalSeparator), '.')
        );
    }
    

    Using it like this:

    parseLocaleNumber('3.400,5', 'de');
    parseLocaleNumber('3.400,5'); // or if you have German locale settings
    // results in: 3400.5
    

    Not the nicest solution but it works :-)

    If anyone knows a better way of achieving this, feel free to post your answer.

    Update

    • Wrapped in a complete reusable function
    • Using the regex class \p{Number} to extract the separator. So that it also works with non-arabic digits.
    • Using number with 5 places to support languages where numbers are separated at every fourth digit.