Herramientas para desarrolladores : Cursos, manuales y guías de referencia : Cursos : Curso de JavaScript :
Capítulo 3: Trabajando con datos e información
- Tipos de datos
- Declaración de variables
- Operadores aritméticos
- Operadores lógicos
- Operadores de comparación
- Operadores condicionales
- Comparaciones: sentencia if ... else
1. Tipos de datos
Los scripts que utilicemos en nuestras páginas HTML manejarán datos y valores para producir resultados. En todo lenguaje de programación existen unos tipos estándar que definen el rango de valores que puede tomar cada dato. Así, un dato del tipo numérico tomará valores numéricos, y no podrá ser una cadena de texto.
En JavaScript un dato puede ser de uno de los siguientes tipos:
| Tipo | Ejemplo |
| Número | Cualquier número, como 12, 22.5 o 2e8 |
| Cadena | "Hola" u 'Hola' |
| Booleano | Verdadero (true) o falso (false) |
| Objeto | Ver Capítulo 4: Funciones y objetos |
| Función | |
| NULL | Palabra clave para indicar ningún valor |
Los números enteros pueden encontrarse en diferentes bases:
- Decimal (base 10): cualquier entero que no empiece por 0 estará representado en base 10.
- Octal (base 8): si el entero se escribe empezando con el dígito 0, estará en base 8.
- Hexadecimal (base 16): para indicar número en hexadecimal, hay que anteponerlo con 0x o 0X (por ejemplo 0x1A).
En JavaScript, la cadena vacía "" es diferente de null.
2. Declaración de variables
Los datos maneja nuestro programa se almacenan en variables. El concepto de variable debe verse como un contenedor de información.
var nombre_variable
nombre_variable = "valor"
La primera línea es la declaración de la variable. La siguiente línea le asigna un valor. Por ejemplo, si queremos guardar el resultado de una suma, podemos definir una variable de nombre resultado y asignarle el valor de la suma.
var resultado
resultado = 10 + 10
La variable resultado contiene ahora el valor 20. Para referirnos a ella, utilizamos su nombre. Como se observa, en JavaScript no es necesario indicar de qué tipo es una variable en el memento de su definición. El tipo del dato queda definido en el momento en que se asigna un valor a la variable.
Por otra parte, podemos realizar la asignación del valor de la variable en el momento de su declaración, del siguiente modo:
var resultado = 10 + 10
Aunque en JavaScript no es estrictamente necesario declarar una variable antes de utilizarla, la declaración mediante el uso de la palabra reservada var es siempre recomendable, por claridad.
El nombre de una variable puede empezar por una letra o por el carácter _. Después ya pueden ponerse números. Los nombres de variables son sensibles a mayúsculas y minúsculas.
Ejemplo:
<HTML>
<HEAD><TITLE>Ejemplo 3.1: uso de una variable</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var name = prompt("Introduce tu nombre:","Nombre")
//-->
</SCRIPT></HEAD>
<BODY>
<SCRIPT LANGUAGE="JavaScript">
<!--
document.write('<IMG SRC="welcome.gif">')
document.write("<H1>Hola " + name + ". ¡Bienvenido a mi página!</H1>")
//-->
</SCRIPT></BODY></HTML>
En este ejemplo se ha utilizado la variable nombre para guardar el nombre del usuario, de forma similar a como se hace en el ejemplo 2.2 del capítulo anterior.
3. Operadores aritméticos
En todo lenguaje de programación existen un conjunto de operadores que permiten realizar operaciones con los datos. Nos referimos a operaciones aritméticas, comparaciones, operaciones lógicas y otras operaciones (por ejemplo, concatenación de cadenas, búsqueda de patrones, etc.).
En JavaScript existen los siguientes operadores aritméticos:
3.1. Binarios
| Operador | Descripción |
| = | Asigna el valor del operando de la izquierda al operando de la derecha |
| += | Suma el operando de la izquierda al de la derecha y asigna el resultado al operando de la derecha |
| -= | Resta al operando de la izquierda el de la derecha y asigna el valor al operando de la derecha |
| *= | Multiplica el operando de la derecha por el de la izquierda y asigna el valor al operando de la derecha |
| /= | Divide el operando de la izquierda por el de la derecha y asigna el valor al operando de la derecha |
| %= | Divide el operando de la izquierda por el de la derecha y asigna el valor del resto de la división al operando de la derecha |
3.2. Unarios
| Operador | Descripción |
| ++x | Incrementa x en una unidad y devuelve el valor |
| x++ | Ddevuelve el valor de x y lo deja incrementado en una unidad |
| -x | Devuelve x negado |
4. Operadores lógicos
Los operadores lógicos son los operadores del álgebra de Bull o booleanos.
| Operador | Descripción |
| && | Y lógico (devuelve verdadero si los dos operandos son verdaderos, y falso en caso contrario) |
| || | O lógico (devuelve verdadero si uno de los dos operandos o ambos son verdaderos, y falso en caso contrario) |
| ! | No lógico (devuelve verdadero si el operando es falso, y falso si es verdadero) |
6. Operadores de comparación
Los operadores de comparación devuelven siempre verdadero (true) o falso (false). Este tipo de operadores se utilizan con gran frecuencia en todos los lenguajes de programación, para realizar una acción u otra en función de que cierta condición sea verdadera o falsa.
| Operador | Descripción |
| == | Devuelve verdadero si los dos operandos son iguales |
| != | Devuelve verdadero si los dos operadores son distintos |
| > | Devuelve verdadero si el primer operando es mayor que el segundo |
| < | Devuelve verdadero si el primer operando es menor que el segundo |
| >= | Devuelve verdadero si el primer operando es mayor o igual que el segundo |
| <= | Devuelve verdadero si el primer operando es menor o igual que el segundo |
7. Operadores condicionales
El operador ? es un operador especial en JavaScript (heredado de C++). Veamos un ejemplo:
(condicion) ? valor1 : valor2
Si la condición es verdadera, la expresión toma el valor 1 y si es falsa el valor 2. Por ejemplo:
(dia=="Domingo") ? "Festivo" : "Laborable"
Ejemplo:
<HTML>
<HEAD><TITLE>Ejemplo operadores</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var pregunta = "¿Cuánto vale 10 + 10?"
var respuesta_correcta = 20
var correcto = "<p>¡CORRECTO!</p>"
var incorrecto = "<p>INCORRECTO</p>"
//realiza la pregunta
var respuesta_dada = prompt(pregunta, "0")
//comprueba la respuesta
var salida = (respuesta_dada == respuesta_correcta) ? correcto : incorrecto
//-->
</SCRIPT></HEAD>
<BODY><SCRIPT LANGUAGE="JavaScript">
<!--
//escribe la salida
document.write(salida)
//-->
</SCRIPT></BODY></HTML>
8. Comparaciones: sentencia if ... else
Las comparaciones se realizan utilizando la sentencia if ... else. Su sintaxis es la siguiente:
if (condicion)
sentencia unica
if (condicion) {
varias sentencias
}
if (condicion) {
varias sentencias
} else {
varias sentencias2
}
Las sentencias if ... else pueden anidarse. En el siguiente script podemos ver un ejemplo de sentencia if ... else.
<HTML>
<HEAD><TITLE>Ejemplo sentencia if ... else</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
//definicion de variables
var pregunta = "¿Cuánto vale 10 + 10?"
var respuesta_correcta = 20
var correcto = "<p>¡Correcto!</p>"
var incorrecto = "<p>¡Incorrecto!</p>"
//realiza la pregunta
var respuesta_dada = prompt(pregunta, "0");
//comprueba la respuesta
if (respuesta_dada != respuesta_correcta) {
//respuesta incorrecta, segunda oportunidad
if ( confirm("¡No! Pulsa OK para reintentarlo."))
respuesta_dada = prompt(pregunta, "0")
}
//comprueba la respuesta
var salida = (respuesta_dada == respuesta_correcta) ? correcto : incorrecto
//-->
</SCRIPT></HEAD>
<BODY><SCRIPT LANGUAGE="JavaScript">
<!--
//escribe la salida
document.write(salida)
//-->
</SCRIPT></BODY></HTML>
