Cómo nombrar nuestras variables en JavaScript correctamente

Introducción

Nombrar variables en JavaScript y TypeScript puede parecer una tarea sencilla, pero en realidad es una habilidad muy importante para cualquier programador. Los nombres de las variables no solo deben ser descriptivos y precisos, sino que también deben seguir una convención de nomenclatura adecuada para garantizar la legibilidad del código y evitar errores.

En este artículo, exploraremos algunas de las mejores prácticas para nombrar variables en JavaScript y TypeScript que ayudarán a mejorar la calidad del código y a hacerlo más fácil de mantener y comprender.

Reglas generales

Antes de comenzar con las reglas más puntuales, destinadas a diferentes tipos de variables, te nombraré y explicaré algunas reglas generales que son relevantes para todos los tipos de variables.

• Utilizar nombres descriptivos: Los nombres de variables deben ser descriptivos y reflejar el propósito o uso de la variable en el código. Un buen nombre de variable debe dar una idea clara de lo que hace la variable.
• Evitar nombres genéricos: Los nombres de variables como 'x', 'n1', 'temp' no son descriptivos y pueden dificultar la lectura y comprensión del código.
• Utiliza nombres en inglés: Es un estándar, que las variables se escriban en inglés, ya que la comunidad de programadores es global, y él inglés es él idioma que se terminó estandarizando.
• Evitar nombres confusos: No utilices nombres de variables que sean similares a otras variables ya existentes en el mismo ámbito, ya que esto puede generar errores en el código.
• Utiliza nombres cortos y concisos: Los nombres de variables deben ser lo más cortos y concisos posible, pero aún así descriptivos.

Variables comunes

Las variables comunes son aquellas que utilizamos con mayor frecuencia. Se pueden utilizar para asignar valores, arrays, objetos literales (diccionarios) y funciones.

• Utilizar "camelCase": Se trata de una convención de nomenclatura que consiste en escribir la primera palabra en minúsculas y las siguientes palabras con la primera letra en mayúscula y el resto en minúscula. Además, no debe haber separación entre las palabras.
• Sustantivos con adjetivos: Para nombrar las variables, es recomendable utilizar sustantivos con adjetivos para representar los datos que se están almacenando. Por ejemplo, si estamos almacenando la edad del usuario, la variable podría llamarse 'userAge'.
• Utiliza un prefijo que indique que la variable es un booleano: Es recomendable utilizar un prefijo que indique si la variable es un booleano, como 'is' o 'has'. Por ejemplo, si la variable indica si un usuario está registrado o no, podrías nombrarla 'isLogged'.

Ejemplos de nombre para variables comunes:

// uso de prefijo
let isLogged = false;

// sustantivo con adjetivo
const userAge = getUser().age;

// sustantivo con adjetivo para un array
let listOfCars = ["Toyota Corolla", "Honda Civic", "Ford Mustang"];

Variables de sólo lectura

Una variable de solo lectura es una variable cuyo valor no se puede modificar una vez que se le ha asignado un valor inicial. El valor de esta variable se define en el código fuente, por lo que conocemos su valor antes de la ejecución del programa.

• Utilizar "SNAKE_CASE": La convención de nomenclatura a la que se hace referencia implica escribir todas las palabras en mayúsculas y separarlas mediante un guión bajo '_'.

Ejemplos de nombres para variables de sólo lectura:

// "variable" utilizara para validar el maximo
// de caracteres de un nombre
const MAX_NAME_LENGTH = 40;

// "variable" utilizada para acceder a
// una base de datos
const DATABASE_PASSWORD = "MySecretPassword";

// "variable" para almacenar la velocidad
// de la luz
const LIGHT_SPEED = 299.792.458;

Métodos y funciones

Las reglas para estos son muy similares a las variables comunes, pero tomando en cuenta algunas pautas extras.

• Verbos en infinitivo: Es recomendable utilizar verbos para indicar la acción que realiza una función o método. Por ejemplo, si la función devuelve un número aleatorio, sería adecuado llamarla 'getRandomNumber' en lugar de simplemente 'randomNumber'. De esta manera, se hace más claro el propósito de la función y se mejora la legibilidad del código.
• Utilizar 'camelCase': Se trata de una convención de nomenclatura que consiste en escribir la primera palabra en minúsculas y las siguientes palabras con la primera letra en mayúscula y el resto en minúscula. Además, no debe haber separación entre las palabras.

Ejemplos de nombres para métodos y funciones:

// función que retorna un numero aleatorio
const getRandomNumber = () => Math.random();

// función que obtiene un usuario por el ID
const getUserById = (id) => users.find((user) => user.id === id);

// función que establece el modo oscuro
const setDarkMode = () => (darkmode = true);

Clases

Una clase es un modelo que define las características y comportamientos de un tipo de objeto en particular, el cual puede ser utilizado para crear múltiples instancias o ejemplares de ese objeto.

• Utilizar 'UpperCamelCase': Esto significa que el nombre de la clase debe comenzar con una letra mayúscula y cada palabra adicional del nombre también debe comenzar con una letra mayúscula. Además, no debe haber separación entre las palabras.
• Usa sustantivos para nombres de clases: Para nombrar adecuadamente las clases en tu código, es recomendable utilizar sustantivos que representen de manera clara el objeto que la clase está modelando. Las clases son una representación de un objeto en la vida real, por lo que se recomienda utilizar sustantivos como 'Animal', 'Auto', 'Estudiante' y otros similares para nombrarlas.

Ejemplos de nombre de clases:

class Animal {}
class Persona {}
class Color {}

Interfaces y Types

En TypeScript, las interfaces se utilizan para definir la estructura de un objeto y sus propiedades y métodos. Nombrar adecuadamente las interfaces es importante para tener un código claro y fácil de entender.

• Utiliza 'I' como prefijo opcional: En TypeScript, es común utilizar 'I' como prefijo opcional para nombrar las interfaces. Esto ayuda a distinguir las interfaces de las clases y otras estructuras de datos. Por ejemplo, una interfaz para un objeto 'Perro' podría llamarse 'IDog'.
• Utiliza un nombre descriptivo: Es importante que el nombre de la interfaz describa de manera clara su propósito y funcionalidad. Por ejemplo, si estamos definiendo una interfaz para un objeto 'Coche', el nombre 'ICar' sería más descriptivo que simplemente 'Ic'.
• Utiliza 'UpperCamelCase': Es buena práctica utilizar UpperCamelCase para nombrar las interfaces en TypeScript. Es decir, la primera letra de cada palabra en el nombre de la interfaz debe ser una letra mayúscula. Por ejemplo, una interfaz para un objeto 'Gato y Perro' podría llamarse 'ICatAndDog'.
• Utiliza nombres singulares para objetos individuales y plurales para colecciones: Cuando se trata de objetos individuales, utiliza nombres singulares para las interfaces. Por ejemplo, una interfaz para un objeto 'Persona' se llamaría 'IPerson'. Sin embargo, cuando se trata de colecciones de objetos, es recomendable utilizar nombres plurales. Por ejemplo, una interfaz para una colección de objetos 'Persona' podría llamarse 'IPeople'.

Conclusiones

Nombrar adecuadamente las variables en JavaScript y TypeScript es fundamental para garantizar la legibilidad, mantenibilidad y claridad del código. Al seguir las buenas prácticas y convenciones presentadas en este artículo, los programadores pueden mejorar la calidad de su código y facilitar su comprensión.

Algunas reglas generales, como utilizar nombres descriptivos, evitar nombres genéricos y utilizar nombres en inglés, son aplicables a todos los tipos de variables. Además, se presentaron pautas específicas para diferentes tipos de variables, como variables comunes, variables de solo lectura, métodos y funciones, clases, interfaces y types.