JS: Format Number

By Xah Lee. Date: . Last updated: .

JavaScript does not have a “format” or “printf” function. The following code are solutions.

Show Only N Decimal Places

Use toFixed.

[see JS: Number.prototype.toFixed]

Show Only N Significant Digits

Use toPrecision, but result may be in exponential notation.

[see JS: Number.prototype.toPrecision]

Show in Exponential Notation

Use toExponential

Example output: "3.12e+2"

[see JS: Number.prototype.toExponential]

Format Number with Metric Prefix

function xah_format_number (n, m = 1) {

/* [

format number with metric prefix, e.g. 1.2 k
n is integer. The number to be converted
m is integer. The number of decimal places to show. Default to 1.
returns a string, with possibly one of k M G T ... suffix.

http://xahlee.info/js/javascript_format_number.html
version 2018-04-28

 ] */

    const prefix = ["", " k", " M", " G", " T", " P", " E", " Z", " Y", " * 10^27", " * 10^30", " * 10^33"]; // should be enough. Number.MAX_VALUE is about 10^308
    let ii = 0;
    while ((n = n/1000) >= 1) { ii++; }
    return (n * 1000).toFixed(m) + prefix[ii];
};

// --------------------------------------------------
// test

console.log(
 xah_format_number(111, 1) === "111.0"
); // true

console.log(
 xah_format_number(111222, 1) === "111.2 k"
); // true

console.log(
 xah_format_number(111222333, 1) === "111.2 M"
); // true

console.log(
 xah_format_number(111222333444, 1) === "111.2 G"
); // true

console.log(
 xah_format_number(111222333444) === "111.2 G"
); // true

console.log(
 xah_format_number(111222333444, 3) === "111.222 G"
); // true

console.log(
 xah_format_number(111222333444, 0) === "111 G"
); // true

Pre ES2015 Version

function xah_format_number (n,m) {
    // format number with metric prefix such as 1.2k
    // n is integer. The number to be converted
    // m is integer. The number of decimal places to show. Default to 1.
    // returns a string, with possibly one of k M G T ... suffix.

    // http://xahlee.info/js/javascript_format_number.html
    // version 2017-03-28

    var prefix = ["", " k", " M", " G", " T", " P", " E", " Z", " Y", " * 10^27", " * 10^30", " * 10^33"]; // should be enough. Number.MAX_VALUE is about 10^308
    var ii = 0;
    var m = ( m === undefined ? 1 : m );
    while ((n = n/1000) >= 1) { ii++; }
    return (n * 1000).toFixed(m) + prefix[ii];
};

// --------------------------------------------------
// test

console.log(
 xah_format_number(111, 1) === "111.0"
); // true

console.log(
 xah_format_number(111222, 1) === "111.2 k"
); // true

console.log(
 xah_format_number(111222333, 1) === "111.2 M"
); // true

console.log(
 xah_format_number(111222333444, 1) === "111.2 G"
); // true

console.log(
 xah_format_number(111222333444) === "111.2 G"
); // true

console.log(
 xah_format_number(111222333444, 3) === "111.222 G"
); // true

console.log(
 xah_format_number(111222333444, 0) === "111 G"
); // true

Number Topic

  1. JS: Format Number
  2. JS: String to Number
  3. JS: Number Object
  4. JS: Number Constructor
  5. JS: Number.prototype

JS String

  1. String Overview
  2. Template String
  3. Char, Code Unit, Code Point
  4. String Escape Sequence
  5. Unicode Escape Sequence
  6. String to Number
  7. Encode URL, Escape String
  8. Format Number
  9. Source Code Encoding
  10. Allowed Characters in Identifier
  11. String Object
  12. String.prototype

RegExp Topic

  1. JS: RegExp Tutorial
  2. JS: RegExp Syntax
  3. JS: Regex Find/Replace
  4. JS: RegExp Object
  5. JS: RegExp Constructor
  6. JS: RegExp.prototype
Liket it? Put $5 at patreon.

Or, Buy JavaScript in Depth

If you have a question, put $5 at patreon and message me.

Web Dev Tutorials

  1. HTML
  2. Visual CSS
  3. JS in Depth
  4. JS Reference
  5. DOM
  6. SVG
  7. Web Dev Blog