Sintaxis de JavaScript y modo estricto

Antes de meternos con variables y funciones, conviene conocer las reglas de escritura del lenguaje. Son pocas, pero saltárselas produce errores muy confusos.

Sentencias y expresiones

Un programa de JavaScript es una secuencia de sentencias que se ejecutan en orden, de arriba abajo.

• Una sentencia hace algo: declara una variable, toma una decisión, repite un bloque.

let x = 5;
if (x > 3) { console.log("grande"); }

• Una expresión produce un valor:

x + 1          // produce 6
x > 3          // produce true
"Hola" + "!"   // produce "Hola!"

Donde JavaScript espera una sentencia puede ir una expresión (por ejemplo, una llamada a función: console.log(x);), pero no al revés: no puedes escribir un if dentro de un console.log(...). Por eso existe el operador ternario, que es un “if” en forma de expresión.

Bloques

Un bloque agrupa varias sentencias entre llaves { }:

if (edad >= 18) {
  console.log("Mayor de edad");
  console.log("Puede votar");
}

Si el bloque tiene una sola sentencia, las llaves se pueden omitir… pero ponlas siempre. Es muy fácil añadir después una segunda línea pensando que está dentro del if cuando no lo está.

El punto y coma

Las sentencias terminan en punto y coma ;. Las que terminan en un bloque (if, for, function…) no lo necesitan.

Si lo olvidas, JavaScript intenta añadirlo por ti (inserción automática de punto y coma). Casi siempre acierta, pero no siempre:

function obtenerDatos() {
  return
  {
    nombre: "Ana"
  }
}
console.log(obtenerDatos()); // undefined (!)

JavaScript pone un punto y coma justo después de return, así que la función no devuelve nada. Hay equipos que no escriben ningún punto y coma y equipos que los escriben todos: lo importante es ser consistente. Aquí recomendamos ponerlos siempre; y una herramienta como Prettier lo hará por ti.

Comentarios

// Comentario de una línea

/*
  Comentario de
  varias líneas
*/

Los comentarios de varias líneas no se pueden anidar (un /* */ dentro de otro).

Un buen comentario explica por qué haces algo, no qué hace el código (eso ya se lee en el código):

// Mal: suma 1 a intentos
intentos = intentos + 1;

// Bien: el primer intento no cuenta porque es de prueba
intentos = intentos + 1;

Mayúsculas y minúsculas

JavaScript distingue mayúsculas de minúsculas: nombre, Nombre y NOMBRE son tres variables distintas. console.log funciona; Console.log o console.Log dan error.

(Para que te sitúes: HTML no las distingue; CSS sí en algunos casos, como los nombres de clase.)

Identificadores

Los nombres que das a variables, funciones y clases se llaman identificadores:

• Pueden llevar letras, números, _ y $.
• No pueden empezar por un número: 2jugadores no vale, jugador2 sí.
• No pueden llevar espacios ni guiones: precio-total es una resta.
• No pueden ser palabras reservadas.

Técnicamente puedes usar tildes y eñes (año, contraseña), pero evítalo: dan problemas con algunos teclados, herramientas y configuraciones.

En empresas, el código (nombres de variables, funciones, comentarios) se escribe casi siempre en inglés, aunque la aplicación esté en español. Mientras aprendes, escribir los nombres en español tiene una ventaja: distingues al momento lo que es tuyo de lo que es del lenguaje.

Convenciones

• camelCase para variables y funciones: precioTotal, calcularMedia.
• PascalCase para clases: Alumno, CarritoDeCompra.
• MAYÚSCULAS_CON_GUIONES_BAJOS para constantes fijas: IVA_GENERAL, MAX_INTENTOS.

Palabras reservadas

No puedes usar como nombre palabras que forman parte del lenguaje, como:

break, case, catch, class, const, continue, default, delete, do, else, export, extends, false, finally, for, function, if, import, in, instanceof, let, new, null, return, super, switch, this, throw, true, try, typeof, var, void, while, yield…

Evita también undefined, NaN e Infinity, y nombres de cosas que ya existen como name, length o event en variables globales.

El modo estricto: 'use strict'

En 2009 se añadió a JavaScript un modo estricto que convierte en errores algunas cosas que antes fallaban en silencio. Se activa escribiendo esta cadena como primera línea del archivo (o de una función):

'use strict';

Es una cadena de texto, no una instrucción: los navegadores antiguos simplemente la ignoran.

Lo más importante que hace:

• Obliga a declarar las variables. Sin modo estricto, si escribes resultdo = 5 (con una errata), JavaScript crea en silencio una variable global nueva. Con modo estricto, da un error y te enteras.
• Prohíbe repetir el nombre de un parámetro en una función.
• Da error al intentar modificar propiedades que no se pueden cambiar.
• Prohíbe sintaxis antigua y confusa, como la sentencia with.

Úsalo siempre. Una buena noticia: el código dentro de módulos y de clases está siempre en modo estricto, sin necesidad de escribirlo.