Guía de JavaScript - Irene-Frias/1DAM GitHub Wiki
JavaScript es un lenguaje de programación esencial para el desarrollo web. Permite crear páginas dinámicas e interactivas, mejorando la experiencia del usuario con efectos visuales, validaciones de formularios, manipulación del DOM y mucho más. Es un lenguaje versátil que se ejecuta en los navegadores y también en el servidor con entornos como Node.js. Aquí te dejamos una guía rápida con los conceptos fundamentales que necesitas conocer para empezar a programar en JavaScript.
JavaScript es un lenguaje de programación ligero y versátil utilizado principalmente para el desarrollo web. Permite crear contenido interactivo y dinámico en sitios web.
La consola del navegador es una herramienta que permite ejecutar y depurar código JavaScript directamente desde el navegador. Puedes abrirla usando F12 o Ctrl + Shift + I en la mayoría de los navegadores modernos.
JavaScript tiene los siguientes tipos de datos:
-
Primitivos:
string,number,boolean,null,undefined,symbol,bigint -
Objetos: estructuras más complejas como
Array,Object,Function.
-
Igualdad:
==,=== -
Desigualdad:
!=,!== -
Mayor/Menor:
>,<,>=,<=
-
AND:
&& -
OR:
|| -
NOT:
!
Se pueden declarar variables usando:
-
var: tiene un comportamiento inesperado debido a su ámbito de función y hoisting (evitar su uso). -
let: para variables que cambian de valor. -
const: para valores constantes.
let nombre = "Juan";
const edad = 25;Estos son valores especiales en JavaScript que indican la ausencia del valor, pero tienen diferencias.
-
null: representa una ausencia intencionada de valor. -
undefined: indica que una variable no ha sido inicializada.
let sinValor;
console.log(sinValor); // undefined
let valorNulo = null;
console.log(valorNulo); // nullEl operador typeof se usa para conocer el tipo de un valor o variable.
console.log(typeof 42); // "number"
console.log(typeof "hola"); // "string"
console.log(typeof true); // "boolean"
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object" (error histórico de JavaScript)-
Comentarios de una línea:
// Esto es un comentario -
Comentarios multilínea:
/* Esto es un comentario multilínea */
// Este es un comentario de una línea
/* Este es un comentario
de múltiples líneas */El método console.log() se usa para imprimir mensajes en la consola del navegador.
console.log("Hola, mundo!");El método alert() muestra un mensaje emergente cuando se carga la página.
alert("Ha cargado la página");El método prompt() pide un valor al usuario y lo devuelve como una cadena de texto.
var nombre = prompt("Introduce tu nombre:"); // Muestra el mensaje
alert("Hola " + nombre); // Muestra un mensaje personalizado -
if-elsepermiten ejecutar un bloque de código solo si se cumple una condición. Se utiliza para evaluar la condición que se quiera al ejecutar el código según el resultado.
let edad = 20;
if (edad >= 18) {
console.log("Eres mayor de edad");
} else {
console.log("Eres menor de edad");
}-
switchse usa cuando tenemos muchas condiciones y queremos que el código sea más ordenado.
let fruta = "manzana";
switch (fruta) {
case "manzana":
console.log("Es una manzana");
break;
case "banana":
console.log("Es una banana");
break;
default:
console.log("No es una fruta conocida");
}-
forse usa cuando sabemos cuántas veces queremos repetir el código.
for (let i = 0; i < 5; i++) {
console.log(i); // 0, 1, 2, 3, 4
}-
whilese usa cuando no sabemos exactamente cuántas veces se ejecutará el código.
let i = 0;
while (i < 5) {
console.log(i);
i++;
}Una función es un bloque de código reutilizable que se ejecuta cuando es llamada.
function saludo() {
alert('Hola Mundo'); // Función simple que muestra un mensaje
}Para el manejo de eventos u otras ocasiones se le pueden pasar algunos parámetros a la función.
function click(event, msg) {
alert(msg);
}Los arrays en JavaScript son estructuras de datos utilizadas para almacenar múltiples valores en una sola variable. Se pueden manipular con diversos métodos y recorrer con bucles.
- Crear una array
let numeros = [1, 2, 3, 4, 5]; // Array de números
let frutas = ["Manzana", "Banana", "Naranja"]; // Array de strings- Acceder a un elemento del array
let frutas = ["Manzana", "Banana", "Naranja"];
console.log(frutas[0]); // "Manzana"
console.log(frutas[1]); // "Banana"
console.log(frutas[2]); // "Naranja"- Operaciones útiles
-
length→ Devuelve la cantidad de elementos en un array. -
indexOf(valor)→ Devuelve la posición de un elemento (o -1 si no está). -
includes(valor)→ Devuelve true si el elemento está en el array. -
reverse()→ Invierte el orden de los elementos. -
sort()→ Ordena los elementos (como strings por defecto).
-
let nombres = ["Ana", "Luis", "Carlos"];
console.log(nombres.length); // 3
console.log(nombres.indexOf("Luis")); // 1
console.log(nombres.includes("Carlos")); // true
nombres.reverse();
console.log(nombres); // ["Carlos", "Luis", "Ana"]
nombres.sort();
console.log(nombres); // ["Ana", "Carlos", "Luis"]