Introducción a JavaScript
## Objetivos de Aprendizaje
- Comprender qué es JavaScript y su historia
- Configurar un entorno de desarrollo JavaScript
- Escribir y ejecutar tu primer programa en JavaScript
- Comprender la sintaxis básica de JavaScript
## ¿Qué es JavaScript?
JavaScript es un lenguaje de programación ligero, interpretado y orientado a objetos que se utiliza principalmente para crear interactividad en páginas web.
```javascript
// Tu primer programa en JavaScript
console.log("¡Hola, Mundo!");
```
## Breve Historia
| Año | Evento |
|-----|--------|
| 1995 | Brendan Eich crea JavaScript en Netscape |
| 1997 | JavaScript se estandariza como ECMAScript |
| 2009 | Node.js permite ejecutar JavaScript en el servidor |
| 2015 | ES6 introduce clases, flechas, promesas y más |
| 2020+ | Actualizaciones anuales con nuevas características |
## ¿Por qué JavaScript?
- **Universal**: Se ejecuta en navegadores, servidores y más
- **Popular**: Uno de los lenguajes más utilizados del mundo
- **Versátil**: Frontend, backend, móviles, APIs y más
- **Comunidad**: Gran ecosistema de bibliotecas y frameworks
## Configuración del Entorno
### Navegador Web
Todos los navegadores modernos incluyen consola de JavaScript:
- **Chrome**: Presiona F12 o Ctrl+Shift+I
- **Firefox**: Presiona F12 o Ctrl+Shift+I
- **Edge**: Presiona F12 o Ctrl+Shift+I
### Node.js
Para ejecutar JavaScript fuera del navegador:
```bash
# Instalar Node.js desde https://nodejs.org
node --version
# Ejecutar un archivo
node app.js
# Modo interactivo
node
```
### Editores de Código
- **VS Code** (recomendado)
- **WebStorm**
- **Sublime Text**
- **Vim/Neovim**
## Tu Primer Programa
### En el Navegador
Crea un archivo `index.html`:
```html
Mi Primera Página
¡Hola, Mundo!
```
### Con Node.js
Crea un archivo `app.js`:
```javascript
console.log("¡Hola, Mundo!");
const nombre = "Juan";
console.log(`Bienvenido, ${nombre}!`);
```
Ejecútalo:
```bash
node app.js
```
## Sintaxis Básica
### Comentarios
```javascript
// Comentario de una sola línea
/*
* Comentario
* de múltiples líneas
*/
```
### Declaraciones
```javascript
// Cada declaración termina en punto y coma (opcional pero recomendado)
const mensaje = "Hola";
let edad = 25;
```
### Mayúsculas y Minúsculas
JavaScript distingue entre mayúsculas y minúsculas:
```javascript
const nombre = "Ana";
// const Nombre = "Pedro"; // Error: Nombre no está definido
```
## Variables
### const (Recomendado)
Para valores que no cambian:
```javascript
const PI = 3.14159;
const NOMBRE = "Mi Aplicación";
```
### let
Para valores que pueden cambiar:
```javascript
let edad = 25;
edad = 26; // Permitido
```
### var (Evitar)
Antiguo, tiene problemas de ámbito:
```javascript
var antiguo = "usar const o let";
```
## La Consola
### console.log()
```javascript
console.log("Mensaje normal");
console.error("Mensaje de error");
console.warn("Advertencia");
console.info("Información");
```
### Interpolación de Cadenas
```javascript
const nombre = "María";
const edad = 30;
console.log(`Hola, ${nombre}. Tienes ${edad} años.`);
console.log(`En 5 años tendrás ${edad + 5} años.`);
```
## Operadores Básicos
```javascript
// Aritméticos
console.log(10 + 5); // 15
console.log(10 - 5); // 5
console.log(10 * 5); // 50
console.log(10 / 5); // 2
console.log(10 % 3); // 1 (residuo)
// Comparación
console.log(10 === 10); // true
console.log(10 !== 5); // true
console.log(10 > 5); // true
```
## Resumen
- JavaScript es un lenguaje de programación versátil para web y más
- Se ejecuta en navegadores (frontend) y con Node.js (backend)
- `const` para valores fijos, `let` para variables
- `console.log()` para mostrar salida
- Las plantillas de cadena (backticks) permiten interpolación
Comments
Comments powered by Giscus
To enable comments, add your Giscus embed code here.
Learn more about Giscus →