Comenzando con JavaScript

Para los vagos como yo, ponerse ha hacer una página Web dinámica, era toda una odisea, sobretodo si esta la empiezas desde 0 usando lenguajes como PHP & mySQL.

Por suerte, para gente como yo, existe el lenguaje de Scripting JavaScript (Al que a parir de ahora, llamaré JS para abreviar).

Está orientado a inet, por ello es usado en navegadores Web, siendo interpretado desde los documentos Web.

Para detalles fáciles (Como mensajes de alerta, introducción de datos, etc) es recomendable usarlo, por su sencillez y potencia. Sobretodo, es fácil para los que venimos de C/C++, pues tiene una sintaxis parecida, aunque mucho menos tipeada.

Paso 1: Integrar el Script

Debemos integrar las etiquetas correspondientes en un documento HTML para indicar que vamos a escribir código en JS. Para ello, usamos:

<script language="javascript">
// Script escrito en JS
</script>

Como vemos es bastante fácil integrarlo. Ahora podemos empezar a practicar operaciones sencillas.

Paso 2: Imprimir texto

Es lo mas básico, por lo menos, para realizar el típico Hola mundo. Basta con llamar al método write del objeto document.

document.write('Hola Mundo');

Si introducimos esto dentro de las etiquetas de Script anteriormente mostradas, y vemos la página en un explorador, veremos el mensaje Hola mundo.

Paso 3: Variables

Al contrario que en C/C++, en JS no hace falta definir el tipo de dato de la variable. Basta con poner el opcode var, seguido del identificador de la variable. Opcionalmente la podemos inicializar al mismo tiempo que la declaramos.

var numero; //Variable entera sin inicializar
var otro_numero =16; // Variable entera inicializada
var mi_nombre="Sergio"; //Cadena
var estado =true; // Variable booleana

Podemos imprimir el contenido de las variables mediante document.write.

document.write(mi_nombre);
document.write("Mi edad es "+otro_numero);
document.write("Mi nombre es "+mi_nombre+" Y mi edad es "+otro_numero);

Paso 4: Alertas

Una alerta es un mensaje que nos sale en la pantalla, mostrando un texto. Suele ser usado, sobretodo, para indicar errores u otro tipo de avisos.

alert("Error");
window.alert("Otro error");

Paso 5: Condicionales y bucles

Como en todo lenguaje de programación que se precie, tenemos la posibilidad de incluir bucles y sentencias condicionales. La sintaxis no varía apenas, como ya vengo diciendo, de C/C++.

var num=5;
var num2 =10;
if (num<num2) alert(num+" esmenor que "+num2);
else document.write(num+" es mayor que "+num2);

Como vemos, si num es mayor que num2, muestra una alerta. Si no, muestra un mensaje en pantalla.

Veamos ahora ejemplo de un bucle while, y de un bucle for.

while (num
{
document.write(num);
num++;
}

for (num=5;num<num2;num++)
{
document.write(num);
}

Como vemos, con while repetimos hasta que se cumpla la condición. En el bucle for, primero inicializamos, luego exponemos la condición, y luego el incremento o decremento de la variable que usamos.

Paso 6: Funciones

No me cansaré de repetir lo que se parece JS a C/C++. En JS, para declarar funciones, basta con poner function + identificador (parámetros).

2 ejemplos de funciones:

var nombre;
function iniciar()
{
nombre=prompt('Ingrese su nombre:','');
}

function fail()
{
alert("Fallaste!!!");
return true;
}

Animo a que probéis los resultados que producen al ser llamadas. Recuerdo que para llamar a una función, basta con:

nombre () ;

En el caso de mis ejemplos:

fail();
iniciar();

Esta es una pequeña introducción a JS, muy pequeña por cierto. No quiero entrar en mas detalles como operadores matemáticos, fechas, etc, pero seguramente en un futuro no muy lejano, haga una 2ª parte con mas contenido sobre JS, pues creo que cada vez lo voy a usar mas.

Ahora, un último ejemplo completo de un archivo index.html con scripts JS.

Pinchar aquí