Tutoriales 2026-06-25 15 min de lectura

Aprender JavaScript desde Cero: Tutorial Completo 2026

JavaScript es el lenguaje mas importante de la web. Cada pagina que visitas lo usa. Es el unico lenguaje que corre directamente en el navegador y tambien en servidores (con Node.js). Si vas a aprender un solo lenguaje, que sea este.

Que es JavaScript y para que sirve

JavaScript es el lenguaje que hace que las paginas web sean interactivas. Sin el, las paginas serian como documentos PDF — puedes verlos pero no puedes interactuar.

Ejemplos reales que usas todos los dias:

Variables: donde guardas datos

Una variable es como una caja con nombre donde guardas informacion. En JavaScript hay 3 formas de crearlas:

// const = no cambia (usa esta por defecto)
const nombre = "Ana";
const edad = 25;

// let = puede cambiar
let puntos = 0;
puntos = 10; // OK, se puede reasignar

// var = la forma antigua (no la uses)
var viejo = "no usar";

Regla: usa const siempre. Solo usa let cuando necesites cambiar el valor despues.

Funciones: bloques reutilizables de codigo

Una funcion es un bloque de codigo que puedes reutilizar. En vez de escribir lo mismo 10 veces, lo metes en una funcion y la llamas cuando la necesites:

// Crear una funcion
function saludar(nombre) {
  return "Hola " + nombre + "!";
}

// Usarla
console.log(saludar("Carlos")); // "Hola Carlos!"
console.log(saludar("Maria"));  // "Hola Maria!"

// Arrow function (forma moderna)
const doble = (num) => num * 2;
console.log(doble(5)); // 10

Arrays y Objetos: organizar datos

// Array = lista ordenada
const frutas = ["manzana", "banana", "naranja"];
console.log(frutas[0]); // "manzana"
console.log(frutas.length); // 3

// Objeto = datos con nombre
const usuario = {
  nombre: "Ana",
  edad: 25,
  premium: true
};
console.log(usuario.nombre); // "Ana"

DOM: controlar la pagina web

El DOM es la representacion de tu pagina HTML en JavaScript. Con el puedes cambiar textos, colores, agregar o eliminar elementos — todo desde codigo:

// Seleccionar un elemento
const titulo = document.querySelector("h1");

// Cambiar su texto
titulo.textContent = "Nuevo titulo!";

// Cambiar estilos
titulo.style.color = "red";

// Agregar un evento
const boton = document.querySelector("#mi-boton");
boton.addEventListener("click", () => {
  alert("Hiciste click!");
});

Siguiente paso

Esto es solo el inicio. JavaScript tiene mucho mas: promesas, async/await, fetch para APIs, modulos, clases, y mas. Lo importante es que ya entiendes lo basico.

Aprende JavaScript interactivamente

El curso de JavaScript de Duobi tiene 21 lecciones con ejercicios interactivos, quizzes y un proyecto final. 100% gratis.

Empezar curso gratis