Search code examples
javascriptroundingtofixed

Reliable JS rounding numbers with toFixed(2) of a 3 decimal number


I am simply trying to round up 1.275.toFixed(2) and I was expecting a return of 1.28, rather than 1.27.

Using various calculators and the simple method of rounding to the nearest hundredth, if the last digit is greater than or equal to five, it should round up.

If this doesn't work with toFixed(2), how would it?

People asking whether console.log(1.275.toFixed(2)) prints off 1.28, here's a quick screenshot MacOS Chrome Version 55.0.2883.95 (64-bit)

enter image description here


Solution

  • The toFixed() method is unreliable in its rounding (see Álvaro González' answer as to why this is the case).

    In both current Chrome and Firefox, calling toFixed() yields the following inconsistent results:

    35.655.toFixed(2) // Yields "36.66" (correct)
    35.855.toFixed(2) // Yields "35.85" (wrong, should be "35.86")
    

    MDN describes a reliable rounding implementation:

    // Closure
    (function() {
      /**
       * Decimal adjustment of a number.
       *
       * @param {String}  type  The type of adjustment.
       * @param {Number}  value The number.
       * @param {Integer} exp   The exponent (the 10 logarithm of the adjustment base).
       * @returns {Number} The adjusted value.
       */
      function decimalAdjust(type, value, exp) {
        // If the exp is undefined or zero...
        if (typeof exp === 'undefined' || +exp === 0) {
          return Math[type](value);
        }
        value = +value;
        exp = +exp;
        // If the value is not a number or the exp is not an integer...
        if (isNaN(value) || !(typeof exp === 'number' && exp % 1 === 0)) {
          return NaN;
        }
        // Shift
        value = value.toString().split('e');
        value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
        // Shift back
        value = value.toString().split('e');
        return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
      }
    
      // Decimal round
      if (!Math.round10) {
        Math.round10 = function(value, exp) {
          return decimalAdjust('round', value, exp);
        };
      }
      // Decimal floor
      if (!Math.floor10) {
        Math.floor10 = function(value, exp) {
          return decimalAdjust('floor', value, exp);
        };
      }
      // Decimal ceil
      if (!Math.ceil10) {
        Math.ceil10 = function(value, exp) {
          return decimalAdjust('ceil', value, exp);
        };
      }
    })();
    
    // Round
    Math.round10(55.55, -1);   // 55.6
    Math.round10(55.549, -1);  // 55.5
    Math.round10(55, 1);       // 60
    Math.round10(54.9, 1);     // 50
    Math.round10(-55.55, -1);  // -55.5
    Math.round10(-55.551, -1); // -55.6
    Math.round10(-55, 1);      // -50
    Math.round10(-55.1, 1);    // -60
    Math.round10(1.005, -2);   // 1.01 -- compare this with Math.round(1.005*100)/100 above
    // Floor
    Math.floor10(55.59, -1);   // 55.5
    Math.floor10(59, 1);       // 50
    Math.floor10(-55.51, -1);  // -55.6
    Math.floor10(-51, 1);      // -60
    // Ceil
    Math.ceil10(55.51, -1);    // 55.6
    Math.ceil10(51, 1);        // 60
    Math.ceil10(-55.59, -1);   // -55.5
    Math.ceil10(-59, 1);       // -50