localization - How to format numbers using JavaScript?

Question

I want to format number using javascript as below:

10.00=10,00 
1,000.00=1.000,00

Answer 1

Every browser supports Number.prototype.toLocaleString(), a method intended to return a localized string from a number. However, the specification defines it as follows:

Produces a string value that represents the value of the Number formatted according to the conventions of the host environment's current locale. This function is implementation-dependent, and it is permissible, but not encouraged, for it to return the same thing as toString.

Implementation-dependant means that it's up to the vendor how the result will look, and results in interoperability issues.

Internet Explorer (IE 5.5 to IE 9) comes closest to what you want and formats the number in a currency style - thousands separator and fixed at 2 decimal places.

Firefox (2+) formats the number with a thousands separator and decimal places but only if applicable.

Opera, Chrome & Safari output the same as toString() -- no thousands separator, decimal place only if required.

Solution

I came up with the following code (based on an old answer of mine) to try and normalize the results to work like Internet Explorer's method:

(function (old) {
    var dec = 0.12 .toLocaleString().charAt(1),
        tho = dec === "." ? "," : ".";

    if (1000 .toLocaleString() !== "1,000.00") {
        Number.prototype.toLocaleString = function () {
           var neg = this < 0,
               f = this.toFixed(2).slice(+neg);

           return (neg ? "-" : "") 
                  + f.slice(0,-3).replace(/(?=(?!^)(?:d{3})+(?!d))/g, tho) 
                  + dec + f.slice(-2);
        }
    }
})(Number.prototype.toLocaleString);

This will use the browser's built-in localization if it's available, whilst gracefully degrading to the browser's default locale in other cases.

Working demo: http://jsfiddle.net/R4DKn/49/