Métodos para redondear números en Front-End, con vanilla Javascript

metodos-de-redondeo-vanilla-javascript-front.js

/* 
Redondeo de números en "decenas" de acuerdo a ciertas configuraciones.
Documentación: https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/floor

¿Por qué haríamos esto?
No recuerdo qué cliente pidió "redondear como en el ERP" y llevarlo a "números más bonitos" sea en múltiplo de 5 o 10; bueno, esta forma lo llevará a la decena anterior o siguiente (entera o decimal), con el método que elijamos en la función Math... Es para jugar un rato y ver qué querés obtener y listo; después el resto es magia en los TPL.
*/

// Función encapsulada, leer la docu si no se entiende, de acuerdo al USO que le demos, se deberá limpiar o refactorizar
// Ver abajo un ejemplo de aplicación práctico

(function(){

	/**
	 * Ajuste decimal de un número.
	 *
	 * @param	{String}	type	El tipo de ajuste.
	 * @param	{Number}	value	El número.
	 * @param	{Integer}	exp		El exponente(el logaritmo en base 10 del ajuste).
	 * @returns	{Number}			El valor ajustado.
	 */
	function decimalAdjust(type, value, exp) {
		// Si el exp es indefinido o cero...
		if (typeof exp === 'undefined' || +exp === 0) {
			return Math[type](value);
		}
		value = +value;
		exp = +exp;
		// Si el valor no es un número o el exp no es un entero...
		if (isNaN(value) || !(typeof exp === 'number' && exp % 1 === 0)) {
			return NaN;
		}
		// Cambio
		value = value.toString().split('e');
		value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
		// Volver a cambiar
		value = value.toString().split('e');
		return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
	}

	// Redondeo decimal
	if (!Math.round10) {
		Math.round10 = function(value, exp) {
			return decimalAdjust('round', value, exp);
		};
	}
	// Redondeo hacia abajo
	if (!Math.floor10) {
		Math.floor10 = function(value, exp) {
			return decimalAdjust('floor', value, exp);
		};
	}
	// Redondeo hacia arriba
	if (!Math.ceil10) {
		Math.ceil10 = function(value, exp) {
			return decimalAdjust('ceil', value, exp);
		};
	}

})();

// Redondeo
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
// Piso
Math.floor10(55.59, -1); // 55.5
Math.floor10(59, 1); // 50
Math.floor10(-55.51, -1); // -55.6
Math.floor10(-51, 1); // -60
// Techo
Math.ceil10(55.51, -1); // 55.6
Math.ceil10(51, 1); // 60
Math.ceil10(-55.59, -1); // -55.5
Math.ceil10(-59, 1); // -50


/* EJEMPLO DE APLICACIÓN: se analiza el precio de un elemento HTML, se lo limpia (se quita el punto de miles, el símbolo pesos/dolar y se traabaja en base a eso. Claramente necesita un refactorizado, este es un ejemplo en la consola para validarlo, se debería hacer para que aplique a todos y no al "content 6271". Pero funciona: */

var extraerPrecio = document.querySelector('.product-price[content="6271"]').innerText;
// "$ 6.271"

var limpiarPrecio = extraerPrecio.replace(/\$/g,''); // limpiamos $
limpiarPrecio = extraerPrecio.replace(/\./g,''); // limpiamos .
// " 6272" (string)

var precioLimpio = parseInt (limpiarPrecio)
// 6271 (entero)

Math.ceil10(precioLimpio, 1);
// 6280 (lo llevamos a la decena siguiente, pero se puede usar otro método, de acuerdo al script de arriba).


// IMPORTANTE: Hay que adaptarlo y validarlo en algún cliente.