Cheatsheet de JavaScript

Declaración de variables

Las variables en JavaScript pueden declararse con let y const.

let nombre = 'Luis'; // Variable que puede cambiar
const edad = 20; // Constante, no puede cambiar

Tipos de datos primitivos en JavaScript

• Number: Representa números, tanto enteros como decimales.
• String: Cadenas de texto.
• Boolean: Verdadero (true) o falso (false).
• Null: Ausencia de valor.
• Undefined: Valor no asignado.
• Symbol: Valor único y inmutable.
• BigInt: Para números enteros grandes.

let numero = 100;
let texto = "Hola Mundo";
let esVerdad = true;
let sinValor = undefined;

Operadores asignación

• Asignación =
• Asignación con operación +=, -=, \*=, /=

Operadores aritméticos

• Suma +
• Resta -
• Multiplicación *
• División /
• Módulo %

Operadores de comparación

• Igualdad ==
• Igualdad estricta ===
• Desigualdad !=
• Mayor >
• Menor <

console.log(10 + 2); // Suma
console.log(3 === 3); // true

Lógicos

• AND lógico `&&^
• OR lógico ||
• NOT lógico !

Declaración de funciones

Las funciones permiten encapsular código que puede reutilizarse.

function sumar(a, b) {
  return a + b;
}

let resultado = sumar(5, 7); // Llamada a la función

Funciones anónimas y funciones flecha

const multiplicar = (x, y) => x * y;

Closures

Un closure es una función que recuerda el entorno en el que fue creada.

function crearContador() {
  let contador = 0;
  return function() {
    contador++;
    return contador;
  };
}

const contador1 = crearContador();
console.log(contador1()); // 1
console.log(contador1()); // 2

Estructura básica

if (condición) {
  // Código si la condición es verdadera
} else {
  // Código si es falsa
}

Operador ternario

Es una forma compacta de escribir condicionales.

let resultado = (edad >= 18) ? 'Adulto' : 'Menor';

For

for (let i = 0; i < 5; i++) {
  console.log(i);
}

While

let i = 0;
while (i < 5) {
  console.log(i);
  i++;
}

ForEach

let numeros = [1, 2, 3, 4];
numeros.forEach(numero => {
  console.log(numero);
});

Declaración de objetos

Un objeto en JavaScript es una colección de pares clave-valor.

let persona = {
  nombre: 'Luis',
  edad: 30,
  saludar: function() {
    return `Hola, soy ${this.nombre}`;
  }
};

console.log(persona.saludar());

Declaración de arrays

Un array es una lista ordenada de elementos.

let frutas = ['Manzana', 'Naranja', 'Plátano'];
console.log(frutas[1]); // Accede a la segunda fruta

Métodos útiles de arrays

let numeros = [1, 2, 3, 4];
let dobles = numeros.map(num => num * 2); // [2, 4, 6, 8]

Declaración de clases

En ES6, las clases permiten crear objetos con métodos y propiedades.

class Persona {
  constructor(nombre, edad) {
    this.nombre = nombre;
    this.edad = edad;
  }
  saludar() {
    return `Hola, soy ${this.nombre}`;
  }
}

let juan = new Persona('Luis', 30);
console.log(juan.saludar());

Herencia en clases

Permite que una clase herede propiedades y métodos de otra.

class Estudiante extends Persona {
  constructor(nombre, edad, curso) {
    super(nombre, edad);
    this.curso = curso;
  }
  estudiar() {
    return `${this.nombre} está estudiando ${this.curso}`;
  }
}

let maria = new Estudiante('María', 22, 'Matemáticas');
console.log(maria.estudiar());

Funciones de Callback

Una función pasada como argumento a otra función.

function procesar(palabra, callback) {
  console.log(`Procesando: ${palabra}`);
  callback();
}

procesar('JavaScript', () => console.log('Proceso completado'));

Manejo de Promesas

Las promesas manejan operaciones asíncronas.

let promesa = new Promise((resolve, reject) => {
  let exito = true;
  if (exito) {
    resolve('¡Éxito!');
  } else {
    reject('Error');
  }
});

promesa.then((mensaje) => console.log(mensaje)).catch((error) => console.error(error));

Sintaxis Async/Await

Una forma más legible de manejar promesas.

async function obtenerDatos() {
  try {
    let respuesta = await fetch('https://api.example.com');
    let datos = await respuesta.json();
    console.log(datos);
  } catch (error) {
    console.error('Error:', error);
  }
}

Seleccionar elementos

let titulo = document.getElementById('titulo');
let items = document.querySelectorAll('.item');

Modificar contenido

titulo.textContent = 'Nuevo Título';

Modificar estilos

titulo.style.color = 'blue';

Agregar eventos a elementos

let boton = document.getElementById('boton');
boton.addEventListener('click', function() {
  alert('Botón clicado');
});

Hacer una petición HTTP

fetch('https://jsonplaceholder.typicode.com/todos/1')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Error:', error));

Convertir a JSON y desde JSON

let objeto = { nombre: "Luis", edad: 30 };
let json = JSON.stringify(objeto); // Convertir a JSON
let nuevoObjeto = JSON.parse(json); // Convertir desde JSON

Exportar módulos

// archivo.js
export const PI = 3.14;
export function sumar(a, b) {
  return a + b;
}

Importar módulos

// main.js
import { PI, sumar } from './archivo.js';
console.log(PI);
console.log(sumar(2, 3));