Especiales JavaScript
En este capítulo, resumimos las características fundamentales de JavaScript que hemos explorado hasta ahora, destacando los detalles relevantes.
Estructura del Código
Las instrucciones en JavaScript se separan con punto y coma:
console.log('Hola');
console.log('Mundo');
Normalmente, un salto de línea también actúa como un separador:
console.log('Hola')
console.log('Mundo')
Este fenómeno se conoce como «inserción automática de punto y coma». Aunque útil, a veces puede llevar a errores, por ejemplo:
console.log("Después de este mensaje, habrá un error.")
[1, 2].forEach(console.log)
function f() {
// No se necesita punto y coma después de una declaración de función
}
for(;;) {
// No se necesita punto y coma después del bucle
}
function f() {
// No se necesita punto y coma después de una declaración de función
}
for(;;) {
// No se necesita punto y coma después del bucle
}
Incluso si se coloca un punto y coma «extra» en algún lugar, JavaScript lo ignora sin generar un error.
Más detalles en: Estructura de Código.
Modo Estricto
Para aprovechar todas las características modernas de JavaScript, se recomienda iniciar los scripts con "use strict":
'use strict';
...
Esta directiva debe estar al principio de un script o al inicio de una función.
Sin la directiva "use strict", JavaScript sigue funcionando, pero algunas características pueden comportarse de manera menos predecible según estándares anteriores.
Algunas características modernas, como las clases (que exploraremos más adelante), activan implícitamente el modo estricto.
Más en: Modo Moderno, "use strict".
Variables
En JavaScript, las variables se declaran usando:
letconst(constante, no modificable)var(forma más antigua, abordaremos esto más adelante)
Los nombres de las variables pueden incluir letras y dígitos, pero no pueden comenzar con un dígito. Los caracteres $ y _ son permitidos, así como letras y símbolos no latinos, aunque estos últimos no son comunes en la práctica.
Las variables en JavaScript son dinámicas, lo que significa que pueden contener cualquier tipo de valor:
let x = 5;
x = "John";
Hay 8 tipos de datos en JavaScript:
number, tanto para números enteros como de punto flotantebigintpara números enteros de longitud arbitrariastringpara textobooleanpara valores lógicos: true/falsenull, que representa un valor vacío o inexistenteundefined, que representa una variable no asignadaobjectysymbol, utilizados para estructuras de datos complejas e identificadores únicos, que exploraremos más adelante.
El operador typeof se utiliza para obtener el tipo de un valor, con dos excepciones notables:
typeof null == "object"; // un error conocido en el lenguaje
typeof function(){} == "function"; // las funciones tienen un tipo especial
Más en: Variables y Tipos de Datos.
Interacción
En el entorno del navegador, interactuamos con los usuarios utilizando funciones básicas de interfaz:
prompt(pregunta, [valorPredeterminado]): Muestra una pregunta y devuelve la entrada del usuario, onullsi se cancela.confirm(pregunta): Muestra una pregunta con opciones de Aceptar y Cancelar, devolviendotrueofalsesegún la elección del usuario.alert(mensaje): Muestra un mensaje al usuario.
Estas funciones son modales, lo que significa que detienen la ejecución del código hasta que el usuario responde.
Ejemplo de uso:
typeof null == "object"; // un error conocido en el lenguaje
typeof function(){} == "function"; // las funciones tienen un tipo especial
Más en: Variables y Tipos de Datos.
Interacción
En el entorno del navegador, interactuamos con los usuarios utilizando funciones básicas de interfaz:
prompt(pregunta, [valorPredeterminado]): Muestra una pregunta y devuelve la entrada del usuario, onullsi se cancela.confirm(pregunta): Muestra una pregunta con opciones de Aceptar y Cancelar, devolviendotrueofalsesegún la elección del usuario.alert(mensaje): Muestra un mensaje al usuario.
Estas funciones son modales, lo que significa que detienen la ejecución del código hasta que el usuario responde.
Ejemplo de uso:
let nombreUsuario = prompt("¿Cuál es tu nombre?", "Alice");
let quiereTe = confirm("¿Te gustaría tomar té?");
alert( "Nombre del visitante: " + nombreUsuario ); // Alice
alert( "Quiere té: " + quiereTe ); // true
Más en: Interacción: alert, prompt, confirm.
Operadores
JavaScript admite una variedad de operadores:
Aritméticos: Operadores estándar como
* + - /, además de%para obtener el resto y**para calcular potencias.Concatenación de texto: El operador
+se utiliza para concatenar cadenas de texto:
console.log('1' + 2); // '12', texto
console.log(1 + '2'); // '12', texto
Asignaciones: Incluyen asignaciones simples como
a = by asignaciones combinadas comoa *= 2.Operadores bit a bit: Trabajan con números enteros de 32 bits a nivel de bits. Consulta la documentación cuando los necesites.
Operador condicional (ternario): El operador condicional
?:es el único operador en JavaScript con tres operandos. DevuelveresultAsicondes verdadero, de lo contrario devuelveresultB.Operadores Lógicos: Los operadores
&&(AND) y||(OR) realizan evaluación de cortocircuito y devuelven el valor en el que se detienen. El operador!(NOT) invierte el valor booleano.Operador de coalescencia nula: El operador
??proporciona una manera de seleccionar el primer valor definido de una lista de variables. Por ejemplo,a ?? bdevuelveasiano esnull/undefined; de lo contrario, devuelveb.
Más en: Operadores Básicos, Aritméticos, Comparaciones, Operadores Lógicos, Operador de Coalescencia Nula ??.
Bucles
JavaScript admite tres tipos principales de bucles:
// 1
while (condición) {
...
}
// 2
do {
...
} while (condición);
// 3
for(let i = 0; i < 10; i++) {
...
}
La variable declarada en el bucle for(let...) solo es visible dentro del bucle. También es posible omitir let y reutilizar una variable existente.
Las directivas break/continue permiten salir de un bucle o continuar con la siguiente iteración. Las etiquetas pueden usarse para controlar bucles anidados.
Más detalles en: Bucles: while y for.
En futuros capítulos, exploraremos otros tipos de bucles para manejar objetos de manera eficiente.
La Construcción «switch»
El constructo switch puede reemplazar múltiples instrucciones if. Utiliza una comparación estricta (===):
let edad = prompt('¿Cuántos años tienes?', 18);
switch (edad) {
case 18:
alert("Has ingresado un número, no una cadena");
break;
case "18":
alert("¡Funciona!");
break;
default:
alert("Este valor no coincide con los anteriores");
}
Detalles en: La Sentencia switch.
Funciones
Hemos explorado tres formas de definir funciones en JavaScript:
Declaración de Función: Definida en el flujo principal del código
function suma(a, b) {
let resultado = a + b;
return resultado;
}
Expresión de Función: Definida como parte de una expresión
let suma = function(a, b) {
let resultado = a + b;
return resultado;
};
Funciones Flecha:
// Expresión en el lado derecho
let suma = (a, b) => a + b;
// Sintaxis multilínea { ... }, se requiere return explícito aquí:
let suma = (a, b) => {
// ...
return a + b;
}
// Sin argumentos
let saludar = () => alert("Hola");
// Con un solo argumento
let doble = n => n * 2;
Las funciones en JavaScript pueden tener variables locales, que son variables declaradas dentro de la función y solo visibles dentro de ella.
Los parámetros de las funciones pueden tener valores predeterminados, como en function suma(a = 1, b = 2) {...}.
Todas las funciones en JavaScript devuelven algo. Si no se especifica un return, el valor devuelto es undefined.
Más en: Funciones, Funciones Flecha, Introducción.
