Purificando tu código

Estela Parrado
2 min readMay 14, 2018

--

En ocasiones creo códigos monstruosos con una larga y profunda cadena de dependencias entre métodos. Este tipo de acoplamiento entre funciones complica a cada paso el código y el funcionamiento óptimo de la aplicación.

Aunque se traten de seguir unos principios de diseño, conseguir funciones puras e independientes a veces es complicado. Pero (casi) todo tiene solución y, en el caso particular de la dependencia externa entre funciones, la inversión de la dependencia (también conocido como Dependency inversion principle) a través de callbacks viene en nuestra ayuda.

Depende, todo depende

Hablamos de dependencia cuando un método de nuestro código necesita información de otro método externo a él para poder actuar. El principal problema de esta conexión profunda entre métodos es que, seguramente, compliquen mucho la ejecución de nuestro código al depender unas partes de otras, puesto que los comportamientos de algunos métodos afectarán a otros de maneras en las que no contábamos con ello.

La dependencia, a veces, es necesaria pero debe limitarse la cantidad de información externa con la que el método trabaja. Hay que conseguir que sea tan autosuficiente como sea posible.

Rompiendo vínculos

Vamos a partir de un código dependiente.

function showTimeInterval() {
countDown - -;
var clock = document.querySelector(‘.clock’);
clock.innerHTML = countDown;
if (countDown === 0) {
renderQuestion();
}
}

La función showTimeInterval es un temporizador que se encarga de reducir una variable temporal (el countDown) e ir pintando en clock el tiempo restante hasta que sea cero. En algún momento de su ejecución, la función showTimeInterval ejecuta la función renderQuestion que, como puede observarse, no forma parte de ella. Por lo tanto, depende de una función externa.

Una de las soluciones más asequibles y sencilla es sustituir la llamada a una función externa por un parámetro. Este parámetro pertenecerá al ámbito de esa función y definiremos lo que ese parámetro representa cuando llamemos a nuestra función showTimeInterval. Esto también se conoce como pasarle a la función un callback.

function showTimeInterval(onTimeOut) {
countDown - -;
var clock = document.querySelector(‘.clock’);
clock.innerHTML = countDown;
if (countDown === 0) {
onTimeOut();
}
}
function ImAnotherMethod() {
renderQuestion();
}
showTimeInterval(ImAnotherMethod);

Sencillo hasta aquí.

Pero, un momento, ¡showTimeInterval sigue dependiendo de alguien! Correcto, sigue siendo dependiente pero ahora no sabe de quién depende y eso hace que se elimine el acoplamiento interno. Es importante controlar la cantidad de información que un método necesita para actuar, de esta manera no se ha eliminado completamente su dependencia, porque en realidad necesitamos que dependa de un factor externo, pero sí hemos conseguido reducir la cantidad de información que ella misma maneja y la hemos convertido en una función pura que se ocupa de un solo concepto, que en este caso es la gestión del tiempo.

--

--

Estela Parrado

Front-end Developer y Diseñadora Gráfica. #Adalaber #GeneracionK en @kairos_ds