在JavaScript中处理21位小数

Question

I'm writing an input range component in JavaScript, the component works with integers to define max , min and step values.

If the user provides a decimal step value, the component will use this function to get the number of decimals and transform it to an integer:

export function getDecimals(num) {
  const stepArr = num.toString().split('.');
  return stepArr[1] ? stepArr[1].length : 0;
}

Doing so, the component can work with integers, and when it needs to return to the user the value inserted by the user (using the range handle), it will convert the number back to a decimal number and set the decimals to the same amount provided by step with this function:

parseFloat(
  newValue.toFixed(getDecimals(this.props.step))
);

this.props.step is the original step value provided by the consumer of the component.

It works pretty well, but I received a bug report where one of the consumers receives a RangeError because the provided step number is:

0.000020735346383538284

This number has 21 decimal digits, while Number.toFixed supports no more than 20 decimal digits.

Here's a repro:

 const step = 0.000020735346383538284; function getDecimals(num) { const stepArr = num.toString().split('.'); return stepArr[1] ? stepArr[1].length : 0; } function toSafe(num) { return parseFloat(num.toFixed(getDecimals(step))); } console.log(toSafe(10)); 

I could easily fix this with:

export function getDecimals(num) {
  const stepArr = num.toString().split('.');
  return Math.min(20, stepArr[1] ? stepArr[1].length : 0);
}

But in this case I'd lose the precision required by the step value, because I would never return a value with more than 20 decimal digits.

How could I handle this case to preserve the precision?

update :

Would this function work or is it going to mess up some numbers because of the string manipulation?

export function toFixed(num, decimals) {
  const parts = num.toString().split('.');
  return Number(`${parts[0]}.${(parts[1] || '').slice(0, decimals)}`);
}

Answer 1

A quick guess would be to use some sort of big number library. Something like this ?