Exercise: Better Precision

Inside the directory you created for this course on JavaScript, create a new folder called Exercise-9-Better-Precision and put the .html solution files for this exercise within it.

Let's first review what should the function betterPrecision() return before moving over to actually define it.

The function is simply an extension to the method toPrecision(). It calls toPrecision() and returns its value back, except for in one case — when toPrecision() returns a stringified number in exponential notation, where the exponent is less than 5. In this case, the number is represented in the normal notation.

An example follows: num is 124 and precision is 1. num.toPrecision(precision) returns '1e+2' with an exponent less than 5. Likewise, the function betterPrecision() converts this value into '100' and returns it.

Alright, with this in mind let's now see how to accomplish this problem.

We start by calling toPrecision() on the provided number with the given precision. The returned value is saved in a local variable stringifiedNum:

function betterPrecision(num, precision) {
   var stringifiedNum = num.toPrecision(precision);
}

Next we check whether stringifiedNum has the e symbol in it — it's only when e is there in this string when we would want to tap into it.

function betterPrecision(num, precision) {
   var stringifiedNum = num.toPrecision(precision);
   if (stringifiedNum.indexOf('e') !== -1) {
      // code goes here
   }
}

If e is there in stringifiedNum, it means that it's followed by the exponent. This exponent is needed to be extracted out from the string and run against another check.

Let's first get done with the extraction and then see the next check.

The extraction works very simply:

1. We slice the string stringifiedNum from the index next to the position where e occurs, all the way to the end of the string.
2. Then we convert this sliced string into a number using Number().

For this extraction, we'll need to save the value returned by stringifiedNum.indexOf('e') so that it could be used again inside the if conditional.

Shown below is the code:

function betterPrecision(num, precision) {
   var stringifiedNum = num.toPrecision(precision);
   var index = stringifiedNum.indexOf('e');

   if (index !== -1) {
       var exp = Number(stringifiedNum.slice(index + 1));
   }
}

Moving on, with the exponent in hand, we see whether it is less than 5. If it is, we know that this value represents the special case of toPrecision(). Hence, it has to be modified and then returned.

What's the modification?

Simply to replace the exponential notation with an equivalent decimal notation.

Alright, time to think....

How to convert a given value. like '1e+3' into an equivalent decimal notation, like '100' (for this case)?

Well, we first need to use the Number() function to convert the stringified number into an actual number and then use the toString() method to convert it back into a string.

Number() would convert the string into a number and expand the exponential notation, since JavaScript returns numbers in exponential notation only when the exponent is greater than or equal to 7. For instance '1e+2' would become 100.

After this, the toString() method converts the number back to a string. This is done to make sure that the return value of betterPrecision() is of the same type as the return value of toPrecision().

To boil it down, the number remains in tact, and the exponential form is gone — just as we desired!

Consider the code below where we accomplish this:

function betterPrecision(num, precision) {
   var stringifiedNum = num.toPrecision(precision);
   var index = stringifiedNum.indexOf('e');

   if (index !== -1) {
      var exp = Number(stringifiedNum.slice(index + 1));
      if (exp < 5) {
 return Number(stringifiedNum).toString();
      }
   }

   return stringifiedNum;
}

Let's now try betterPrecision() on a couple of numbers:

function betterPrecision(num, precision) {
   /* ... */
}

console.log(betterPrecision(124, 1));
console.log(betterPrecision(124, 2));
console.log(betterPrecision(178, 1));

Superb!

This completes our exercise.