JavaScript: Elementos básicos

Elementos Básicos de JavaScript

1. Operadores

Los operadores son símbolos que realizan operaciones sobre variables y valores. Incluyen operadores aritméticos, de comparación, lógicos, y más.

        // Aritméticos
        let a = 10;
        let b = 5;
        let suma = a + b; // 15

        // Comparación
        let esMayor = (a > b); // true

        // Lógicos
        let resultado = (a > 5) && (b < 10); // true

        // Asignación
        let c = 5;
        c += 2; // c es ahora 7

        // Incremento/Decremento
        a++; // 11
        b--; // 4
    

2. Condicionales

Las estructuras condicionales permiten tomar decisiones en el flujo de ejecución del código, basándose en condiciones específicas.

        // if
        if (a > b) {
            console.log("a es mayor que b");
        }

        // else
        else {
            console.log("a no es menor que b");
        }

        // else if
        if (a < b) {
            console.log("a es menor");
        }

        // switch
        switch (a) {
            case 10:
                console.log("a es diez");
                break;
        }
    

3. Bucles

Los bucles permiten ejecutar un bloque de código repetidamente, ya sea un número determinado de veces o mientras una condición se cumpla.

        // for
        for (let i = 0; i < 5; i++) {
            console.log(i); // 0, 1, 2, 3, 4
        }

        // while
        let j = 0;
        while (j < 5) {
            console.log(j); // 0, 1, 2, 3, 4
            j++;
        }

        // do...while
        let k = 0;
        do {
            console.log(k); // 0, 1, 2, 3, 4
            k++;
        } while (k < 5);
    

4. Funciones

Las funciones son bloques de código reutilizables que realizan una tarea específica. Pueden aceptar parámetros y devolver resultados.

        // Definición
        function sumar(x, y) {
            return x + y;
        }
        let resultado = sumar(5, 3); // 8
    

5. Métodos

Los métodos son funciones asociadas a objetos. Permiten realizar acciones específicas relacionadas con el objeto.

        // Método de un objeto
        let persona = {
            nombre: "Juan",
            saludar: function() {
                console.log("Hola, " + this.nombre);
            }
        };
        persona.saludar(); // "Hola, Juan"
    

6. Objetos

Los objetos son colecciones de propiedades (pares clave-valor). Permiten agrupar datos y funciones relacionadas.

        // Creación de un objeto
        let coche = {
            marca: "Toyota",
            modelo: "Corolla",
            año: 2020
        };
        console.log(coche.marca); // "Toyota"
    

7. Clases

Las clases son plantillas para crear objetos. Permiten implementar la programación orientada a objetos en JavaScript.

        // Definición de una clase
        class Animal {
            constructor(nombre) {
                this.nombre = nombre;
            }
            hablar() {
                console.log(this.nombre + " hace un sonido.");
            }
        }
        let perro = new Animal("Perro");
        perro.hablar(); // "Perro hace un sonido."
    

8. Eventos

Los eventos son interacciones del usuario con la página web. JavaScript puede reaccionar a estos eventos, como clics o desplazamientos del mouse.

        // Manejo de un evento de clic
        document.getElementById("miBoton").addEventListener("click", function() {
            alert("Botón clicado");
        });
    

9. Confirmaciones y Alertas

Las alertas y confirmaciones son métodos para mostrar mensajes al usuario. `alert` muestra un mensaje simple, mientras que `confirm` pregunta al usuario por una decisión.

        // Uso de alert y confirm
        alert("¡Hola, mundo!");
        let confirmar = confirm("¿Quieres continuar?");
        if (confirmar) {
            console.log("Continuar...");
        } else {
            console.log("Cancelado.");
        }
    

10. break y continue

Las instrucciones `break` y `continue` permiten controlar el flujo de los bucles. `break` finaliza el bucle, mientras que `continue` salta a la siguiente iteración.

        // Uso de break
        for (let i = 0; i < 5; i++) {
            if (i === 3) {
                break; // Sale del bucle
            }
            console.log(i); // 0, 1, 2
        }

        // Uso de continue
        for (let i = 0; i < 5; i++) {
            if (i === 2) {
                continue; // Salta la iteración actual
            }
            console.log(i); // 0, 1, 3, 4
        }
    

Ejemplos prácticos:



⬅ Volver a la Página Principal