JavaScript es un lenguaje de programación de alto nivel ampliamente utilizado en desarrollo web para crear interactividad en las páginas. En este tutorial, te introduciré a los conceptos básicos de JavaScript y cómo incorporarlo en páginas web mediante scripts.
Conceptos Básicos de JavaScript
1.Variables: Permiten almacenar datos. Se definen usando `var`, `let` o `const`.
var edad = 25; // Variable usando var
let nombre = "Juan"; // Variable usando let (preferible)
const PI = 3.14159; // Constante
2.Tipos de Datos: JavaScript tiene tipos de datos como números, cadenas, booleanos, objetos, etc.
var numero = 42; // Número
var texto = "Hola"; // Cadena de texto
var esVerdadero = true; // Booleano
3.Funciones: Bloques de código reutilizable que realizan una tarea específica.
function saludar(nombre) {
console.log("Hola, " + nombre + "!");
}
saludar("María"); // Llama a la función
4.Condicionales (if-else): Permiten ejecutar diferentes bloques de código según una condición.
var edad = 20;
if (edad >= 18) {
console.log("Eres mayor de edad");
} else {
console.log("Eres menor de edad");
}
5.Bucles: Permiten repetir un bloque de código varias veces.
for (var i = 0; i < 5; i++) {
console.log("Iteración " + i);
}
Incorporación de JavaScript en Páginas Web
Puedes incorporar JavaScript en tu página web de varias formas:
1.Incorporación Directa: Agrega código JavaScript dentro de la etiqueta `<script>` en tu HTML.
<script>
function saludar(nombre) {
alert("Hola, " + nombre + "!");
}
</script>
2.Archivo Externo: Crea un archivo `.js` separado y enlázalo en tu HTML.
<script src="mi_script.js"></script>
3.Eventos: Asocia funciones JavaScript a eventos HTML.
<button onclick="saludar('Ana')">Saludar</button>
Primer Script en JavaScript
Vamos a crear un simple script que muestre un saludo en la consola del navegador.
1.HTML:
<!DOCTYPE html>
<html>
<head>
<title>Mi Primer Script en JavaScript</title>
</head>
<body>
<button onclick="mostrarSaludo()">Mostrar Saludo</button>
<script>
function mostrarSaludo() {
console.log("¡Hola desde mi primer script en JavaScript!");
}
</script>
</body>
</html>
Este es un simple ejemplo para empezar. A medida que te familiarices con JavaScript, podrás crear aplicaciones web interactivas y dinámicas. ¡Practica y experimenta para mejorar tus habilidades en JavaScript!