Son zonas de la memoria del ordenador identificadas por un nombre y capaces de almacenar información que puede variar durante la ejecución del programa.

Declaración de variables

Declarar una variable significa reservar un espacio en la memoria que almacenará la información de la variable. Es como crear una caja en la que más adelante pondremos información.

Se declaran de la siguiente forma, utilizando la palabra reservada let, definiendo el nombre de la variable y el valor de la variable.

let nombreVariable = 'Valor de la variable';

Aunque puedes crear variables sin declararlas (evitando usar la palabra reservada let), esto no es recomendable. Es decir, mejor no crear variables sin declararlas, que es lo que hago en el siguiente código:

nombreVariable = 'Valor de la variable';

Si quieres que en tu código no sea posible crear variables sin declararlas, puedes poner la instrucción ‘use strict’ al principio del mismo. De esta forma, se producirá un error si no declaramos nuestras variables:

<script>
    'use strict';
    nombreVariable = 'Valor de la variable'; // Esta línea dará error
</script>

Nomenclatura de las variables

Escoger acertadamente el nombre de nuestras variables nos permitirá que el código se explique así mismo sin necesidad de añadir comentarios. Por ejemplo, la siguiente línea es bastante ambigua:

let variable = 7;

Pero esta otra línea, escogiando un nombre de variable más representativo de la información que va a contener, nos permitirá intuir fácilmente que tipo de información tiene la variable:

let edadUsuario = 7;

Observa que cuando queremos dar un nombre a una variable que esta compuesto por varias palabras utilizamos la nomenclatura camelCase. En este tipo de nomenclatura, la primera palabra empieza por minúscula y cada nueva palabra comienza por mayúcula.

let esteNombreDeVariableUtilizaCamelCase;

Tipos de dato

¿Qué es un tipo de dato? El tipo de dato de una variable determina el tipo de dato que se esta almacenando. Por ejemplo:

Si una variable almacena un número, su tipo de dato será number.
Si una variable almacena un texto, su tipo de dato será string.

Javascript establece el tipo de dato de una variable de manera dinámica, es decir durante la ejecución del programa, en función del valor que le hemos asignado. Si a una variable le asignamos como valor una cadena de texto, Javascript decidirá que el tipo de dato es String. Si le asignamos un número, Javascript decidirá que el tipo de dato es Number.

let txt = 'Hola que tal'; // Esta variable es de tipo texto
let number = 5; // Esta variable es de tipo numérico

Existe una extensión del lenguaje Javascript (una librería que puedes añadir a tu desarrollo) que permite usar el tipado estático en Javascript. De esta forma, indicaremos el tipo de dato de las variables en el momento de su declaración. Esta librería se llama Javascript.

A continuación tienes algunos ejemplos de declaración de variables con tipado estático utilizando TypeScript.

let miTexto: string = "Hola, soy una variable de texto";
let miNumero: number = 42;

La instrucción typeof de Javascript nos devolverá el tipo de dato que Javascript le ha asignado a la variable en cuestión:

let txt = 'Hola que tal'; // Esta variable es de tipo texto
let number = 5; // Esta variable es de tipo numérico

console.log(typeof txt); // string
console.log(typeof number); // number

Los tipos de dato primitivos de Javascript son:

Number

let i = 5;
let j = 3;

console.log(i+j);
console.log(i, j);

Notaciones numéricas

Notación hexadecimal

En general, almacenamos los valores numéricos utilizando el sistema decimal (en base 10, de toda la vida). Sin embargo, aunque poco frecuente, en Javascript también podemos almacenar valores utilizando el sistema hexadecimal (en base 16).

Aquí tienes algunos ejemplos:

let n1 = 0x21; // 2*16¹ + 1*16⁰ = 32 + 1 = 33

Notación científica

let x = 2e4; // 2 * 10⁴ = 20000

String

Su valor se escribe entre comillas.

let texto='Soy una cadena';
console.log(texto);

¿Qué se mostrará por consola al ejecutar el siguiente código?

let texto="Soy una cadena";

console.log('texto'); 
console.log(texto);

texto
Soy una cadena

Comillas dentro de comillas

Si en una cadena de texto queremos introducir unas comillas dentro de otras, tendremos las siguientes opciones:

Comillas simples dentro de comillas dobles:

"Hola 'amigo'"

Comillas dobles dentro de comillas simples:

'Hola "amigo"'

Escapar las comillas:

"Hola \"amigo\""

Boolean

Sólo pueden almacenar dos tipos de valores: true/false.

Undefined

Representa una variable que no ha sido inicializada.

Null

Representa la ausencia intencional de cualquier valor.

Symbol

BigInt

Permite representar numeros enteros grandes que no pueden ser representados con el tipo Number. Se escriben con el sufijo n. (ej: 100n).

Conversión de tipos

Convertir un número en texto:

let number = 5;
let numberConvertedInText1 = String(number);
let numberConvertedInText2 = ''+number;

Análogamente, la siguiente operación dará como resultado 53, en lugar de 8, ya que la variable i es convertida a texto al concatenarla con las comillas vacías, y la variable j es convertida en texto al concatenarla con la cadena de texto ‘5’.

let i = 5;
let j = 3;

console.log('' + i + j);

Convertir un texto en un número

let txt= '5';
let number1 = Number(txt);
let number2 = +txt;
let number3 = parseInt(txt); // Esto lo convierte a un número entero, eliminando los decimales si los hubiese

Ejercicios

1. Declara una variable de tipo entero, asígnale un valor y muéstralo por consola.

let n = 7;
console.log(n);

2. Declara una variable de tipo texto, asígnale un valor y muéstralo por consola.

let txt = "Hola";
console.log(txt);

3. Asigna el valor de la variable a a la variable b.

let a;
a = 7;
let b // modificar únicamente esta línea
console.log(b); // Debería mostrarse el valor de a

let a;
a = 7;
let b = a;
console.log(b);

4. Modifica las siguientes declaraciones de variables para que sean camelCase.

let TituloDeLaPelicula;
let camelCaseBienPuesto;
let EDaddelMonstruo;

let tituloDeLaPelicula;
let camelCaseBienPuesto;
let edadDelMonstruo;

5. ¿Cuanto valor tendrá i después de ejecutar el siguiente código?

let i = 7;
i = 5;
i = 3;
console.log(i); // ¿Qué valor se mostrará por consola?

i = 3

6. Intercambiar el contenido de dos variables

Tras ejecutar el código, a debería valer 7 y b debería valer 5, y esos serán los valores que mostrarán los logs.

Tras añadir el código, si cambias únicamente los valores de a y b, todo debería seguir funcionando igual, de manera que los valores de ambas variables sigan intercambiandose.

let a = 5;
let b = 7;
// ... aquí y sólo aquí añadiremos las líneas de codigo
console.log('a: ', a); //Debería mostrar 7
console.log('b: ', b); //Debería mostrar 5

El ámbito de las variables

Es la parte del programa en la que esa variable está disponible. Fuera de esa zona del programa, la variable no existe. El ámbito de una variable está delimitado por {}.

Por ejemplo:

let variable1 = 5;
{
    let variable2 = 7;
    console.log(variable1); // 5
    console.log(variable2); // 7
}
console.log(variable1); // 5
console.log(variable2); // Esta línea dará error

Las varíables cuyo ámbito está limitado a un fragmento de código se llaman locales. Las variables cuyo ámbito es toda la aplicación, se llaman globales.

Shadowing se produce cuando declaras una variable local con un nombre que has utilizado previamente en una variable más global:

let variable1 = 5;
{
    let variable1 = 7;
    console.log(variable1); // 7
}
console.log(variable1); // 5

Ver preguntas de la certificación JSE-40-01