Buenas prácticas en JS (I) Consideraciones generales

Aunque ya hablamos (vimos un vídeo) sobre las buenas prácticas en JS hoy os voy a hablar sobre una serie de comportamientos que debemos o deberíamos de  llevar a cabo cuando programamos en JavaScript, de este modo podremos ir evitando bugs y eliminar los malos modos.

Hoisting

Es una mala costumbre el ir declarando las variables conforme las vamos necesitando, lo correcto y que nos servirá para evitar bugs es declararlas al principio de su ámbito, y luego ir utilizándolas de forma normal.

Use strict

El uso estricto se utiliza en el código, ya sea al principio del mismo como dentro de una función (también al principio) si queremos que solo tenga alcance local.

Utilizando “use strict” conseguimos entre otras cosas que si se utiliza una variable no declarada el código produzca un error.

"use strict";
x = 4;    //Producirá un error (x no esta definida).

De este modo se consigue escribir mejor la sintaxis de JS, además de convertir en errores las malas prácticas que podemos estar cometiendo.

Cosas que no nos permite realizar el uso estricto son:
  • Usar una variable sin estar declarada
  • Usar un objeto sin declararlo
  • Eliminación de variables, funciones y objetos
  • Tener un parámetro duplicado en una función manteniendo el mismo nombre (function x (p1, p1){})
  • Utilizar octales numéricos de forma literal (var x = 010;)
  • Caracteres de escape cómo \
  • Escribir en una propiedad get o de lectura
  • No se puede borrar una propiedad imborrable
  • No se permite el uso de la cadena “eval”
  • No se puede utilizar la cadena “with”

Guía de estilo

Estas normas son pautas para el estilo de programación cubriendo amplios aspectos de como debemos de gestionar nuestro código de forma general, mejorando la legibilidad y haciendo el mantenimiento más fácil.

Nombres de variables y funciones

En javaScript se utiliza el llamado camelCase que consiste en nombrar las variables y funciones de forma seguida identificando las palabras que lo componen poniendo la primera letra de cada palabra (exceptuando la primera) en mayúscula, por ejemplo: estoEstaEscritoEnCamelCase.

Las variables globales se debe de escribir en mayúsculas

Las constantes como PI se escriben en mayúsculas

Espacios alrededor de los operadores

Siempre debemos de poner espacios alrededor de los operadores (= + – * /) y después de las comas.

Sangría

Se deben de utilizar 4 espacios para el sangrado entre bloques de código.

Reglas de declaración
  • Siempre debemos de terminar las declaraciones simples con punto y coma ;

Para declaraciones complejas tipo bucles o funciones debemos de seguir las siguientes normas:

  • La llave de apertura se pone en el extremo de la primera línea con un espacio delante
  • La llave de cierre se coloca en una línea nueva.
  • El final de una declaración de este tipo nunca lleva el punto y coma
for (i = 0; i < 5; i++) {
    x += i;
}
Reglas de objetos
  • Se coloca el soporte de apertura en la misma línea que el nombre del objeto
  • Se utilizan dos puntos : más un espacio entre cada propiedad y su valor
  • Se utilizan comillas entorno a los valores de cadena no a lo numéricos
  • No se añade una coma después del último para propiedad – valor
  • La llave de cierre se coloca en una nueva línea
  • Se debe de terminar la definición del objeto con punto y coma
var persona = {
    nombre: "Juana",
    apellido: "Calamidad",
    edad: 34,
    ojos: "verdes"
};

Los objetos también pueden escribirse en una línea utilizando espacios entre las propiedades:

var persona = {nombre:"Juana", apellido:"Calamidad", edad:34, ojos:"verdes"};
Longitud de la línea inferior a 80 caracteres

Para facilitar la lectura, y si no coge en estos 80 caracteres lo mejor es romperla después de un operador o coma.

Cargando JavaScript en HTML

Se utiliza la sintaxis simple:

<script src="miscript.js">
Nombres de archivos

Para evitar cometer errores a la hora de leer archivos, se recomienda que estos tengan los nombres completamente en minúsculas como por ejemplo: logo.jpg