Este documento proporciona consejos para mejorar la calidad del código, incluyendo evitar errores de notificación, comentar archivos y funciones, eliminar código inutilizado, usar identación y espaciado consistentes, nombrar variables de forma descriptiva, separar lógica y presentación, y declarar variables al comienzo.

1. Calidad de código

2. 2/24
Evita los NOTICES por desbordamientos de array
asociativo
 error_reporting(0);
 error_reporting(E_ALL ^ E_NOTICE);
 Una forma mucho más elegante de hacerlo:

3. 3/24
Evita los comentarios papagayo

4. 4/24
Comenta cada fichero, arriba, en la cabecera

5. 5/24
Comenta cada función, encima, en su cabecera
 Incluye los comentarios de lo que hace la función arriba, evita
comentar en medio del código

6. 6/24
Elimina el “código chatarra” de tu código de
explotación
 Trozos de código comentado
 Funciones que no se usan
 Variables que no se usan
 Ficheros que no se usan
 ...

7. 7/24
Algunas normas de notación
 Variables: camel (inicial minúscula)
 Clases: camel (inicial mayúscula)
 Funciones, métodos: camel (inicial minúscula)
 Ficheros: camel (inicial minúscula)
 Tags y atributos HTML: minúsculas

8. 8/24
Separa lógica de negocio y presentación
ERROR: Se mezcla lógica y
presentación

9. 9/24
Identación: establece siempre mismo espacio de
tabulación

10. 10/24
Sé consistente con los tipos
 Dentro del fichero cronometro.js:
●
¿qué utilidad tiene la variable
intentos?
●
¿Qué tipo de dato le va a asignar
el parser de JS?
●
¿Qué tipo de dato habría sido
más adecuado?
 ¿De qué tipo son los datos que
almacena?
 Hubiera sido más adecuado entrecomillar
 Mejor haber usado array asociativo para
cachear BBDD en memoria

11. 11/24
Nombres de variables alusivos a su cometido
 En la práctica del juego del cronómetro, qué significado crees que
tienen las siguientes variables:
 var RALI;
 $_POST[“peticion”]
 var interruptor, interruptor2, interruptor3;
 var RASI;

12. 12/24
Cuida el lenguaje, nunca sabes a dónde puede llegar
tu código

13. 13/24
Identación de bloques de código
Errores de identación!!! ● Antes de una llave abrir,
un espacio
● Después de una llave
abrir, nueva línea
● Las instrucciones dentro
de un bloque, una
tabulación a la derecha
● La llave cerrar en una
nueva línea, justo a la
altura de la instrucción
que abrió el bloque
● Detrás de la llave,
instrucciones con
idéntica tabulación que
la llave cerrar

14. 14/24
Identación de funciones
function funcion1() {
instruccion1;
instruccion2;
instruccion3;
} Coloca exactamente
un espacio
Idéntica tabulación
para las instrucciones
consecutivas

15. 15/24
Identación de bloques if
instruccion1;
if ((x < 4) || (i <= 3)) {
instruccion2;
instruccion3; ● Operadores relacionales, aislados
} con un espacio a cada lado
else { ● Cada condición con su propio
paréntesis
instruccion4; ● instrucciones dentro del if, 1
} tabulación derecha
instruccion5; ● instrucciones dentro del else, 1
tabulación derecha
● Llave abrir, 1 espacio antes
● Llave cerrar justo debajo del if/else
● Al cerrar la llave, eliminamos 1
tabulador izquierda

16. 16/24
Alert: Minimiza su uso
 Los mensajes de Alert resultan molestos en la navegación

17. 17/24
Aisla la declaración de estilos a .CSS
 Ejemplo de correcto aislamiento:

18. 18/24
Aisla la declaración de estilos a .CSS
 Ejemplo de mal aislamiento:

19. 19/24
Nombres de funciones deben contener un verbo
 Las funciones son una acción, luego deben contener un verbo:
actualizarResltado, calcularCoste, envierCorreo,
comprobarLogin,...
 Una función que se llama cronómetro, ¿qué hace?
●
Difícil de intuir sin leer el código

20. 20/24
Nombres de clases deben ser un sustantivo
 Nombres como Jugador, JugadoresList, Partida, Torneo,... son
nombres válidos de clases
 NO tiene sentido una clase que se llame SortearPartido, parece
más lógico que se trate de un método de una clase

21. 21/24
Nombres de fichero alusivos a su contenido
 Imagina los siguientes nombres de fichero:
●
javascript.js
●
js.js
●
utilidadesFechas.js
●
funcionesCifrado.js
 Los dos primeros es algo así como decir “Sube pa'rriba”

22. 22/24
Cada función entre líneas de separación
// ­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­
function f1() {
...
}
// ­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­
function f2() {
...
}
// ­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­­

23. 23/24
Nombres de fichero alusivos a su contenido
 Imagina los siguientes nombres de fichero:
●
javascript.js
●
js.js
●
utilidadesFechas.js
●
funcionesCifrado.js
 Los dos primeros es algo así como decir “Sube pa'rriba”

24. 24/24
Declaración de variables: nunca en medio
 Las variables podemos declararlas al comienzo del fichero, como
variables globales
 También podemos declararlas al comienzo de una función
 Evitar su declaración en medio del código
function f1() { OK
var x;
var y;
instruccion1;
instruccion2; !!!
...
var j;
instruccion12;
}