Las bases son importantes, es por eso que no puedes continuar tu camino para convertirte en una gran desarrolladora con JavaScript sin que tengas claras estas 11 reglas que te ayudarán a escribir un código mucho más limpio y legible, ya sea que te quieras enfocar en el front-end con React o en el back-end con Node.js. Estoy seguro que podrás escribir código que funcione, pero esto no es suficiente; necesitas que sea entendible y limpio para que otras personas puedan leerlo sin problemas.
Regla 1: Nombrar adecuadamente a las variables
Debes evitar nombrar a las variables de manera extraña o al azar.
// Incorrecto
const z = 2;
Nombra siempre a tus variables con nombres apropiados y descriptivos, relacionados con el valor que almacenan.
// Correcto
const numberOfChildren = 2;
Regla 2: Usa la convención camelCase en tus variables
Cada lenguaje tiene su propias convenciones, en JavaScript se usa una conocida como camelCase, la cual consiste en que la primera letra siempre debe iniciar en minúscula y cuando inicie otra palabra la primera letra de esta debe ir en mayúscula.
// Incorrecto
const UserName = "Gabriel";
// Correcto
const userName = "María";
Regla 3: Nombra bien a tus funciones
Las funciones (sean de expresión o declarativas) deben ir en camelCase y su nombre debe iniciar con un verbo.
// Incorrecto
// Inicia con letra mayúscula
functionDoSomething() {
// code
}
// Inicia con un sustantivo
functioncar() {
// code
}
// Usa guion bajo
functiondo_something() {
// code
}
// Correcto
functiondoSomething() {
// code
}
Regla 4: Constantes Globales
Las variables que sean constantes y globales cuyo valor no va a cambiar no deberían de ser nombradas como variables normales. Son una especie de variables especiales.
// Incorrecto
const numberOfChildren = 2;
La manera correcta de nombrarlas es completamente en mayúsculas y cada palabra debe ser separada por un guion bajo.
// Correcto
const NUMBER_OF_CHILDREN = 2;
Regla 5: Asignación de variables
No asignes un valor de una comparación a una variable sin haber utilizado los paréntesis.
// Incorrecto
const flag = i < count;
Solo debes de usar paréntesis para agrupar la expresión. Sí, como en las matemáticas.
// Correcto
const flag = (i < count);
Regla 6: Compara bien
No uses ==, tampoco != cuando quieras comparar valores. La razón es porque en estas comparaciones no estas comparando el tipo de dato solo comparas el valor.
// Incorrecto
if(a == b) {
// code
}
En lugar de eso, cuando compares siempre deberías usar el === o !== de esta manera te aseguras de que siempre estés comparando el valor y el tipo de dato.
// Correcto
if(a === b) {
//code
}
Regla 7: Uso del operador ternario
No uses el operador ternario como una alternativa al if.
// Incorrecto
condition ? doSomething() : doSomethingElse;
Úsalos solo para asignar valores en función de alguna condición.
// Correcto
const value = condition ? value1 : value2;
Regla 8: Declaraciones simples
No escribas múltiples declaraciones de variables en una misma linea. JavaScript lo permite pero no es lo mejor.
// Incorrecto
a = b; count++;
En lugar de eso, debes de tener una linea por cada declaración y siempre usar el punto y coma al final de la linea.
// Correcto
a = b;
count++;
Regla 9: Uso del “if”
A pesar de que JavaScript te lo permite, no debes omitir las llaves y nunca deberías escribirlo en una sola linea.
// Incorrecto
// Sin llaves
if (condition)
doSomething();
// Con llaves pero en una sola linea
if (condition) { doSomething(); }
// Sin llaves y en una sola linea
if (condition) doSomething();
Usa siempre las llaves y haz el bloque de código correspondiente.
// Correcto
if (condition) {
doSomething();
}
Regla 10: Uso del ciclo “for”.
No declares la variable iteradora en la inicialización de un ciclo for
// Incorrecto
for (let i = 0; i < arr.length; i++) {
// code
}
Siempre declara la variable iteradora antes del ciclo.
// Correcto
let i;
for (i = 0; i < arr.length; i++) {
// code
}
Regla 11: Strings
Para escribir las cadenas de texto en tu código JavaScript no deberías de unas comillas simples (‘’).
// Incorrecto
const description = ‘thisis a description’;
En lugar de eso, escribe las cadenas de texto siempre con comillas dobles (“”).
// Correcto
const description = "this is a description";
¡Perfecto! Si sigues estas simples pero importantes reglas definitivamente tu podrás escribir un código de JavaScript mas limpio y legible. Al final lo que importa es que puedas escribir un código mas limpio y legible por todos.
Cabe recalcar que estas reglas ¡no son de oro!, pero si estas empezando pueden ser una buena guía para que tengas buenas practicas desde el inicio.
Te invito a que continúes con tu camino a que convertirte en una desarrolladora de JavaScript, para ello te recomiendo la escuela de desarrollo web y la Ruta Profesional de JavaScript.
¡Nunca pares de aprender! 💚
Curso Básico de JavaScript
