Language Tour

Inicia tu camino hacia una carrera lucrativa aprendiendo a programar desde cero. No necesitas experiencia previa, solo la ambición de mejorar tu futuro. ¡Inscríbete y comienza hoy!

Quiero mejorar mi futuro

JavaScript es un lenguaje de programación versátil que se puede usar de diferentes maneras. Es dinámico, lo que significa que puede cambiar mientras se está ejecutando. Tiene tipos y operadores (que son como las reglas y símbolos matemáticos), así como objetos y métodos estándar (funciones predefinidas que puedes usar).

Su estructura básica se parece a los lenguajes de programación Java y C, lo que significa que si sabes uno de esos lenguajes, aprender JavaScript puede ser más fácil.

JavaScript permite la programación orientada a objetos, lo que significa que puedes crear “objetos” que contienen datos y funciones. También permite la programación funcional, lo que significa que puedes usar funciones (pequeños bloques de código que realizan tareas específicas) de una manera muy flexible, como si fueran datos. Esto hace que sea fácil crear, usar y pasar funciones en tu código.

En esta página veremos una vista rápida sobre la sintaxis del lenguaje, es decir, cómo se escribe.

Aquí te comparto otros Language Tour para que explores aún más:

Kotlin Este recorrido cubre los aspectos básicos del lenguaje de programación Kotlin y se puede realizar en su totalidad desde su navegador. No requiere instalación

Swift Un recorrido rápido - Explora las características y la sintaxis de Swift.

Tipos de datos

Es muy importante dominar los tipos de datos básicos para sentir confianza al utilizar el lenguaje.

Number: Utilizado para todos los valores de números (Enteros y con punto flotante) excepto para números muy grandes.
BigInt: Utilizado para números muy grandes.
String: Utilizado para almacenar texto.
Boolean: true y false - usualmente utilizado en condicionales lógicos.
Symbol: Utilizado para crear identificadores únicos que no colisionen entre sí. Es decir, valores que son siempre únicos.

Cualquier tipo de dato aparte es considerado un Object.

Algunos tipos de objetos comunes incluyen:

Números

JavaScript tiene dos tipos de números: Number y BigInt.

El tipo Number es un valor de punto flotante de doble precisión de 64-bit según la convención de la IEEE 764, esto significa que los enteros pueden ser representados entre -(2⁵³ − 1) y (2⁵³ − 1) sin perder precision, y números con punto flotante que pueden ser almacenados hasta 1.79 × 10308. Entre los números, JavaScript no distingue entre punto flotante y enteros.

console.log(3 / 2); // 1.5, no 1

Así que un número entero es en realidad implicitamente un número con punto flotante. Debido al estandar IEEE 754 la precisión de los puntos flotante puede ser imprecisa.

console.log(0.1 + 0.2); // 0.30000000000000004

Para las operaciones que esperan número enteros, como las operaciones de bit a bit, el número se convertirá en un entero de 32 bits.

Los literales numéricos también pueden tener prefijos para indicar la base numérica (Binaria, octal, decimal o hexadecimal) o un sufijo de exponente.

console.log(0b111110111); // 503
console.log(0o767); // 503
console.log(0x1f7); // 503
console.log(5.03e2); // 503

El tipo BigInt es un entero de longitud arbitraria. Los BigInt se especifican con un literal numérico y un sufijo n.

console.log(-3n / 2n); // -1n

Se admiten los operadores aritméticos estándar, incluidos suma, resta, etc. Los BigInt y los números no se pueden mezclar en operaciones aritméticas.

El objeto Mathproporciona funciones y constantes matemáticas estándar.

Math.sin(3.5);
const circunferencia = 2 * Math.PI * r;

Hay tres formas de convertir una cadena en un número:

parseInt(), que analiza la cadena en busca de un entero.
parseFloat(), que analiza la cadena en busca de un número de punto flotante.
La función Number() que analiza una cadena como si fuera un literal numérico y admite muchas representaciones numéricas diferentes.

También puedes utilizar el operador unario como abreviatura de Number().

Los valores numéricos también incluyen NaN (abreviatura de “No es un número”) y Infinity. Muchas operaciones “matemáticas no válidas” devolverán NaN(por ejemplo, si se intenta analizar una cadena no numérica o se utiliza Math.log() con un valor negativo). La división por cero produce INfinity (positivo o negativo).

NaN es contagioso, es deicir, si lo utilizas para hacer operaciones matamáticas, el resultado siempre será NaN.

Strings

Las cadenas de texto en JavaScript son secuencias de caracteres Unicode UTF-16.

console.log("Hello, world");
console.log("你好，世界！"); // Casi todos los caracteres Unicode pueden utilizarse en literales Strings

Las cadenas se pueden escribir con comillas simples o dobles: JavaScript no distingue entre caracteres y cadenas. Si deseas representar un solo carácter, simplemente utiliza una cadena que conste de ese único carácter.

console.log("Hello"[1] === "e"); // true

Para encontrar la longitud de una cadena (en unidades de código), es a través de su propiedad length es decir longitud.

Las cadenas tienen métodos de utilidad para manipularlas y acceder a información sobre ellas. Debido a que todas las cadenas de texto son inmutables por diseño, es decir, no pueden cambiar, estos métodos devuelven nuevas cadenas.

El operador +, además de ser utilizado para números, también puede ser utilizado para cadenas de texto: cuando lo utilizamos con cadenas de texto, en lugar de sumar, concatena (junta) las cadenas. También podemos utilizar plantillas en las cadenas de texto para agregar variables dentro de las cadenas.

const edad = 25;
console.log("Tengo " + edad + " años."); // Concatenación de String
console.log(`Tengo ${edad} años.`); // Plantilla de String (Template Literals en Inglés)

Otros tipos

JavaScript distingue entre nulos, es decir, cuando queremos que una variable no tenga valor, y undefined, que indica la ausencia de valor de forma predeterminada. Hay varias formas de obtener undefined:

Cuando utilizamos return sin regresar nada (return;) o de forma explicita regresar undefined.
Accediendo a un una propiedad inexistente en un objeto.
Cuando declaramos una variable sin darle un valor (let x;).

JavaScript tiene un tipo Boolean con dos posibles valores true y false. Ambos son palabras reservadas para el lenguaje. Cualquier valor puede ser convertido a un booleano de acuerdo a las siguientes reglas:

false, 0, strings vacíos (""), NaN, null, y undefined se convierten en false.
Todos los demás valores se convierten en verdadero.

Puedes realizar esta conversión de forma explícita utilizando la función Boolean():

Boolean(""); // false
Boolean(234); // true

Sin embargo, esto es raramente necesario, porque JavaScript de forma silenciosa convierte los valores a booleanos cuando lo considera necesario, como cuando se utiliza un valor en un if.

También se admiten operaciones booleanas como && (y lógico), || (o lógico) y !(no lógico).

El tipo Symbol se utiliza para crear identificadores únicos. Se garantiza que cada símbolo creado con la función Symbol() será único. Además, existen símbolos preexistentes en el lenguaje.

Variables

Las variables en JavaScript se declaran utilizando una de estas tres palabras clave: let, const, o var.

let permite declarar variables a nivel de bloque. La variable declarada está disponible en el bloque en el que se encuentra.

let a;
let nombre = "Simon";

// miVariableLet *no* es visible aquí

for (let miVariableLet = 0; miVariableLet < 5; miVariableLet++) {
  // miVariableLet sólo es visible aquí
}

// miVariableLet *no* es visible aquí

const permite declarar variables cuyos valores nunca deben cambiar. La variable está disponible en el bloque en el que se declara.

const Pi = 3.14; // Declara la variable Pi
console.log(Pi); // 3.14

Una variable declarada con const no se puede reasignar, es decir, cambiar su valor.

const Pi = 3.14;
Pi = 1; // Esto arrojará un error porque no puedes cambiar el valor de una constante.

const evita que reasignes su valor, pero no evita que cambies los valores de un objeto.

const obj = {};
obj.a = 1; // no error
console.log(obj); // { a: 1 }

var puede tener comportamientos sorprendentes (por ejemplo, no tienen alcance de bloque) y no se recomiendan en el código JavaScript moderno.

Si declaras una variable sin asignarle ningún valor, su valor será undefined. No puedes declarar una const sin asignarle un valor, porque de todos modos no puedes cambiarla más adelante.

las variables declaradas con let y const siguen ocupando todo el ámbito en el que están definidas y se encuentran en una región conocida como zona muerta temporal antes de la línea de declaración real.

function fun(x, condicion) {
  if (condicion) {
    console.log(x);
    const x = 2;
    console.log(x);
  }
}

fun(1, true);

JavaScript tiene tipos dinámicos. Los tipos dinámicos (como se describe en la sección anterior) solo se asocian con valores, pero no con variables. En el caso de let las variables declaradas, siempre pueden cambiar su tipo mediante una reasignación.

let a = 1;
a = "texto";

Operadores

Los operadores numéricos de JavaScript incluyen +, -, *, /, %(resto) y **(exponenciación). Los valores se asignan mediante =. Cada operador binario también tiene una contraparte de asignación compuesta, como += y -=, que se extienden hasta x = x operador y.

x += 5;
x = x + 5;

Puede utilizar ++ y -- para incrementar y decrementar respectivamente. Estos pueden utilizarse como operadores de prefijo o de sufijo.

El operador + también realiza concatenación de textos:

"hola" + " mundo"; // "hola mundo"

Si agregas un texto a un número (u otro valor), todo se convierte primero en un texto. Esto puede ser confuso:

"3" + 4 + 5; // "345"
3 + 4 + "5"; // "75"

Agregar una cadena vacía a algo es una forma útil de convertirlo en una cadena.

Las comparaciones en JavaScript se pueden realizar utilizando <, >, <= y >=, que funcionan tanto para cadenas como para números. Para la igualdad, el operador de doble igualdad realiza una coerción de tipos si se le asignan tipos diferentes, es decir, no es estricto al comparar los resultados. Por otro lado, el operador de triple igualdad no intenta la coerción de tipos, es decir, es estricto al compararlos y, por lo general, es preferible utilizarlo.

123 == "123"; // true
1 == true; // true

123 === "123"; // false
1 === true; // false

Los operadores doble igual y triple igual también tienen sus contrapartes de desigualdad: != y !==.

JavaScript también tiene operadores bit a bit y operadores lógicos. Cabe destacar que los operadores lógicos no funcionan solo con valores booleanos, sino que funcionan según la “veracidad” del valor.

const a = 0 && "Hola"; // 0 porque 0 es "falseable"
const b = "Hola" || "mundo"; // "Hola" porque ambos "Hola" y "mundo" son "veraces"

Los operadores && y || utilizan lógica de cortocircuito, lo que significa que la ejecución del segundo operando depende del primero. Esto resulta útil para comprobar si hay objetos nulos antes de acceder a sus atributos:

const name = o && o.getName();

O para almacenar valores en caché (cuando los valores falsos no son válidos):

const name = cachedName || (cachedName = getName());

Para obtener una lista completa de operadores, consulte la página de la guía o la sección de referencia. Puede que te interese especialmente la precedencia de operadores.

Gramática

La gramática de JavaScript es muy similar a la de C. Hay algunos puntos que vale la pena mencionar:

Los identificadores pueden tener caracteres Unicode, pero no pueden ser una de las palabras reservadas.
Los comentarios son comúnmente // o /* */.
Los puntos y comas son opcionales en JavaScript: el lenguaje los inserta automáticamente cuando es necesario. Sin embargo, hay ciertas advertencias a tener en cuenta, ya que los puntos y comas siguen siendo parte de la sintaxis.

Para una mirada en profundidad a la gramática de JavaScript, consulte la página de referencia de gramática léxica.

Estructuras de Control

Las sentencias condicionales son compatibles con if y else; puedes encadenarlas entre sí:

let name = "gatitos";
if (name === "perritos") {
  name += " woof";
} else if (name === "gatitos") {
  name += " meow";
} else {
  name += "!";
}
name === "gatitos meow";

JavaScript tiene bucles while y do…whilebucles. El primero es bueno para bucles básicos; el segundo es para bucles en los que desea asegurarse de que el cuerpo del bucle se ejecute al menos una vez:

while (true) {
  // un bucle infinito
}

let entrada;
do {
  entrada = tomar_entrada();
} while (entradaNoValida(entrada));

El bucle for permite proporcionar la información de control para un bucle en una sola línea.

for (let i = 0; i < 5; i++) {
  // Se ejecuta 5 veces
}

JavaScript también contiene otros dos bucles for destacados: for…of, que itera sobre iterables, especialmente matrices, y for…in, que visita todas las propiedades enumerables de un objeto.

for (const valor of arreglo) {
  // hacer algo con el valor del arreglo
}

for (const propiedad in objeto) {
  // hacer algo con la propiedad del objeto
}

La sentencia switch se puede utilizar para múltiples ramas según la verificación de igualdad.

switch (accion) {
  case "dibujar":
    dibuja();
    break;
  case "comer":
    come();
    break;
  default:
    noHagasNada();
}

Las cláusulas de case son conceptualmente iguales a las etiquetas, por lo que si no agrega una un break, la ejecución “pasará al siguiente nivel”. Sin embargo, en realidad no son tablas de salto: cualquier expresión puede ser parte de la cláusula case, no solo literales de cadena o números, y se evaluarían una por una hasta que una sea igual al valor que se busca. La comparación se realiza entre los dos utilizando el operador ===.

Las estructuras de control son declaraciones en JavaScript, lo que significa que no puedes asignarlas a una variable, como const a = if (x) { 1 } else { 2 }.

Los errores de JavaScript se manejan mediante la declaración try…catch.

try {
  construirMiSitioWeb("./sitioweb");
} catch (e) {
  console.error("La construcción del sitio web falló:", e);
}

Se pueden generar errores mediante la declaración throw. Muchas operaciones integradas también pueden generar errores.

function construirMiSitioWeb(directorioDelSitio) {
  if (!laRutaExiste(directorioDelSitio)) {
    throw new Error("El directorio del sitio no existe");
  }
}

En general, no se puede saber el tipo de error que se acaba de detectar, porque se puede lanzar cualquier cosa desde una declaración throw. Sin embargo, normalmente se puede asumir que es una instancia de Error, como en el ejemplo anterior. Hay algunas subclases de Error, como TypeError y RangeError, que se pueden usar para proporcionar semántica adicional sobre el error. No hay captura condicional en JavaScript: si solo se desea gestionar un tipo de error, es necesario capturar todo, identificar el tipo de error mediante instanceof y, a continuación, volver a lanzar los otros casos.

try {
  construirMiSitioWeb("./sitioweb");
} catch (e) {
  if (e instanceof RangeError) {
    console.error("Parece que el parametro está fuera de rango:", e);
    console.log("Reintentando...");
    construirMiSitioWeb("./sitioweb");
  } else {
    // Si no sabes cómo manejar otros errores; puedes arrojarlos
    // para que alguna llamada más arriba pueda manejarlo.
    throw e;
  }
}

Si ningún elemento de la pila de llamadas detecta un error try...catch, el programa se cerrará.

Para obtener una lista completa de declaraciones de flujo de control, consulte la sección de referencia.

Inicia tu camino hacia una carrera lucrativa aprendiendo a programar desde cero. No necesitas experiencia previa, solo la ambición de mejorar tu futuro. ¡Inscríbete y comienza hoy!

Quiero mejorar mi futuro