FUNDAMENTOS JAVASCRIPT [SOLUCIONADO]

Principios Básicos de JavaScript

Los principios fundamentales de JavaScript o simplemente JavaScript son esenciales para entender cómo se comporta este lenguaje y conseguir un desarrollo de software competente y eficiente. Para los nuevos programadores o incluso para los que buscan afianzar sus conocimientos, tener una base sólida sobre estas premisas es clave para el éxito en este campo.

Uno de los primeros elementos a dominar son las variables, que sirven para almacenar datos que pueden ser utilizados y modificados durante la ejecución del código.

var nombre = 'Alicia';
let edad = 25;
const pi = 3.1416;

Copiar

Como se observa en el ejemplo, var, let, y const tienen distintos usos y alcances que es crucial entender para evitar errores comunes.

Tipos de Datos en JavaScript

En JavaScript, las distintas categorías de datos con las que se puede trabajar son tipos primitivos y objetos. Comprender las diferencias y características de cada uno permite manipular la información de manera adecuada.

• String: Cadena de texto.
• Number: Números enteros y flotantes.
• Boolean: Valores verdadero o falso.
• Null: Representa un valor nulo o “vacío”.
• Undefined: Indica que una variable no ha sido asignada.
• Object: Colecciones complejas de pares clave-valor.

let esProgramador = true;
let sueldo = 45000.00;
let nombreCompleto = "Juan Pérez";
let objetosNull = null;

Copiar

Estructuras de Control

Las estructuras de control son herramientas que permiten alterar el flujo de ejecución del código. Los bucles como ‘for’, ‘while’ y condicionales como ‘if’ y ‘switch’, son fundamentales en cualquier programa.

if (usuarioActivo) {
    console.log('El usuario está activo.');
} else {
    console.log('El usuario no está activo.');
}

for (var i=0; i < 10; i++) {
    console.log('Número ' + i);
}

Copiar

Funciones en JavaScript

Las funciones son bloques de código reutilizables que pueden tomar argumentos, realizar una tarea y devolver un resultado. Son cruciales para estructurar el código, hacerlo más mantenible y reutilizable.

function saludar(nombre) {
    return 'Hola, ' + nombre + '!';
}
console.log(saludar('Carmen'));

Copiar

Además de las funciones convencionales, las funciones flecha son una alternativa más corta y con un manejo del contexto de this diferente.

const sumar = (a, b) => a + b;
console.log(sumar(5, 3)); // Salida: 8

Copiar

Eventos en JavaScript

La interactividad en las aplicaciones web es manejada a través de eventos que pueden ser escuchados y manejados mediante JavaScript. Estos eventos incluyen acciones como clics del ratón, toques en pantalla, presionar teclas, entre otros.

document.getElementById('botonEnviar').addEventListener('click', function() {
    console.log('El usuario hizo clic en Enviar');
});

Copiar

Trabajando con Objetos y Arrays

Los objetos y arrays son dos estructuras de datos que ofrecen una manera de organizar y almacenar información más compleja. Permite agrupar datos y acceder a ellos de forma eficiente.

let usuario = {
    nombre: 'Laura',
    edad: 33,
    activo: true
};

let frutas = ['Manzana', 'Banana', 'Cereza'];

console.log(usuario.nombre); // Salida: Laura
console.log(frutas[1]); // Salida: Banana

Copiar

Promesas y Asincronía

La asincronía es esencial para entender cómo manejar operaciones que toman tiempo, como peticiones a servidores o lectura de archivos. Las promesas y async/await son dos patrones de diseño para trabajar con código asincrónico de manera más simple y legible.

function obtenerDatos() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Datos obtenidos con éxito');
        }, 2000);
    });
}

obtenerDatos().then(datos => {
    console.log(datos);
});

Copiar

El async/await es una sintaxis más elegante que simplifica el manejo de las promesas.

async function mostrarDatosAsync() {
    let datos = await obtenerDatos();
    console.log(datos);
}

mostrarDatosAsync();

Copiar

Módulos en JavaScript

Con la llegada de ES6, se introdujo el concepto de módulos, lo cual permite dividir el código en distintos archivos para facilitar su mantenimiento y reutilización. Utilizar import y export es esencial en el desarrollo moderno.

// archivo calculadora.js
export function sumar(a, b) {
    return a + b;
}
export function restar(a, b) {
    return a - b;
}

// archivo principal.js
import { sumar, restar } from './calculadora.js';

console.log(sumar(10, 5));
console.log(restar(10, 5));

Copiar