Diferencia entre toFixed() y toPrecision() en JavaScript

JavaScript ofrece muchas funciones para formatear números, y dos de las más comunes son toFixed() y toPrecision(). Ambas funciones se utilizan para redondear un número a una cantidad especificada de dígitos, pero tienen diferencias significativas en cómo realizan la redondeo y en qué contingencias están diseñadas para abordar.

toFixed()

La función toFixed() se utiliza para redondear un número a un número específico de decimales. Toma un argumento que indica cuántos decimales se deben mantener después del punto decimal, y devuelve una cadena que representa el número redondeado.

Por ejemplo:

let num = 2.5678;
let roundedNum = num.toFixed(2);
console.log(roundedNum); // Output: "2.57"

Observe que la salida de toFixed() es una cadena, no un número. Si el número decimal tiene menos dígitos de los que se especifican en el argumento, toFixed() rellena la cadena resultante con ceros.

let num = 2.5;
let roundedNum = num.toFixed(4);
console.log(roundedNum); // Output: "2.5000"

toPrecision()

La función toPrecision() también se utiliza para redondear un número, pero en lugar de especificar la cantidad de dígitos después del punto decimal, se especifica la cantidad total de dígitos. Toma un argumento que indica cuántos dígitos se deben mantener en total (incluyendo los dígitos antes y después del punto decimal).

Por ejemplo:

let num = 123.45;
let roundedNum = num.toPrecision(4);
console.log(roundedNum); // Output: "123.5"

Si el número tiene más dígitos que los que se especifican en el argumento, toPrecision() automáticamente cambiará al modo exponencial (notación científica).

let num = 1234.5678;
let roundedNum = num.toPrecision(5);
console.log(roundedNum); // Output: "1234.6e+3"

¿Cuándo usar cada uno?

La elección entre toFixed() y toPrecision() depende de la situación. Si se desea especificar una cantidad de dígitos después del punto decimal, toFixed() es la opción adecuada. Si se desea especificar una cantidad total de dígitos (independientemente de su ubicación), toPrecision() es la opción adecuada.

Sin embargo, también hay que considerar que toFixed() sólo es aplicable a números decimales, mientras que toPrecision() es aplicable a cualquier tipo de número. Además, las cadenas de salida de ambas funciones pueden estar sujetas a problemas de precisión y redondeo comunes en la programación.

Ejemplos de código

Estos son algunos ejemplos de código donde se utiliza toFixed() y toPrecision().

Para usar toFixed():

let num = 3.14159;
let roundedNum = num.toFixed(2);
console.log(roundedNum); // Output: "3.14"

Para usar toPrecision():

let num1 = 4567;
let num2 = 0.00001234;
let roundedNum1 = num1.toPrecision(3);
let roundedNum2 = num2.toPrecision(4);
console.log(roundedNum1); // Output: "4.57e+3"
console.log(roundedNum2); // Output: "0.00001234"

Conclusión

Es importante conocer las diferencias entre toFixed() y toPrecision() para poder utilizar la función adecuada según las necesidades del proyecto. Ambas funciones pueden ser útiles para redondear números, pero deben aplicarse con precaución y no se pueden realizar sin conocer las limitaciones y lo que se desea lograr.

Preguntas frecuentes

¿Se pueden aplicar ambas funciones a cualquier tipo de número?

No, sólo se puede aplicar toFixed() a números decimales. toPrecision() se puede aplicar a cualquier tipo de número.

¿Qué hace toFixed() si el número decimal tiene menos dígitos de los que se especifican en el argumento?

toFixed() rellena la cadena de salida con ceros.

¿Qué hace toPrecision() si el número tiene más dígitos que los que se especifican en el argumento?

toPrecision() automáticamente cambiará al modo exponencial (notación científica).

Cómo reemplazar todos los caracteres especiales en una cadena en JavaScript

Cómo cambiar el texto de una etiqueta usando JavaScript

Cómo escribir un número de teléfono celular de manera internacional utilizando JavaScript

Compruebe si un valor no es igual a 0 usando JavaScript

Cómo verificar si un elemento contiene una clase en JavaScript

Cómo llamar a una función de JavaScript en HTML

Cómo agregar opciones a una etiqueta select desde un campo de entrada utilizando JavaScript

Cómo usar Bootstrap con Vue.js

Cómo realizar "Splicing" de cadenas en JavaScript