Input | Output |
---|---|
0.12 | 12% |
0.0012345 | 0.12% |
0.0 | 0 |
2 significant digits but locale-sensitive, strip meaningless trailing zeroes and decimal dividers.
const formatPercentage = function (value) { return new Intl.NumberFormat( undefined, // use browser locale // Choose the options that get us closest to our desired style – a percentage that tells you enough to be useful but no unnecessary decimal places or trailing zeroes. { style: "percent", // Treat decimals as percentages, multiplying by 100 and adding a % sign. minimumSignificantDigits: 2, maximumSignificantDigits: 2 } ) .format(value) // \D here is the locale-agnostic decimals separator. .replace(/(\D[0-9]*?)0+%$/, "$1%") // Get rid of trailing zeroes after the decimal separator. .replace(/\D%/, "%") // Clean up the scenario where we got rid of everything after the decimal separator and now have something like "4.%. .replace(/^0%$/, "0"); // Replace literal "0%" with "0" as zero is unitless. };