jueves, 9 de enero de 2014

Tutorial Javascript parte 3 - Operadores (Aritméticos, Relacionales y Lógicos)





Bienvenid@s a la parte 3 del tutorial de Javascript, en este ocasión seguimos con los fundamentos básicos del lenguaje javascript y concretamente con los principales operadores que podemos encontrar.

Para empezar vamos a crear un nuevos archivo, al cual llamaremos fundamentos-2.js y lo guardaremos como siempre en la carpeta javascript, también vamos a embeber este nuevo capítulo en el archivo index.html ...

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="javascript/fundamentos-2.js"></script>
</head>
<body>
</body>
</html>


Bien, pero antes de empezar a escribir código vamos a ver las materias de este capítulo.

Operadores Aritméticos



Los operadores aritméticos nos van a permitir realizar operaciones matemáticas, así como tambíen nos ayudarán al manejo de string mediante la concatenación.

  • signo + : nos permitirá realizar sumas y también concatenar strings.
  • signo - : nos permitirá realizar restas.
  • signo * : nos permitirá realizar multiplicaciones.
  • signo / : nos permitirá realizar divisiones.
  • signo % : nos permitirá obtener el resto de una división.


Operadores Relacionales



Este tipo de operadores nos van a permitir evaluar valores, son especialmente útiles para cuando manejemos estructuras de control, aunque esto queda para un próximo capítulo.

  • signo == : Igualdad
  • signo != : Distinto
  • signo < : Menor que
  • signo <= : Menor o igual que
  • signo > : Mayor que
  • signo >= : Mayor o igual que


Operadores Lógicos



Nos vamos a permitir obtener un resultado a partir de que se cumpla o no una determinada condición.

  • signo && : el operador AND, ambas condiciones sean ciertas.
  • signo || : el operador OR, al menos una de las condiciones es cierta.
  • signo ! : el operador NOT, si la condición no es cierta.


Ok, ahora es momento de ver estos operadores en práctica, copia y pega el siguiente código en fundamentos-2.js y guárdalo ...

/* Operadores aritméticos 

Suma +
Resta -
Multiplicación *
División /
Resto %

*/

var numero1 = 12;
var numero2 = 5;

var total = numero1 * numero2;
document.write("<p>El total de " + numero1 + " * " + numero2 + " es igual a " + total + "</p>");

var numero1 = 15;
numero1 -= 1; //Equivale a numero1 = numero1 + 1;
document.write("<p>" + numero1 + "</p>");

/* Operadores relacionales 

> mayor que
>= mayor o igual que
< menor que 
<= menor o igual que 
== igual
!= distinto

*/

var numero1 = 12;
var numero2 = 12;

if (numero1 == numero2)
{
document.write("<p>Bien " + numero1 + " y " + numero2 + " son iguales</p>");
}
else
{
document.write("<p>Error " + numero1 + " y " + numero2 + " no son iguales</p>");
}

/* Operadores lógicos 

AND && : Ambas condiciones son ciertas
OR || : Al menos una de las dos condiciones es cierta
Negación ! : La condición no es cierta

*/

var numero1 = 12;
var numero2 = 12;
var numero3 = 10;
var numero4 = 8;

if (numero1 == numero2 || numero3 < numero4)
{
document.write("<p>Es cierto</p>");
}
else
{
document.write("<p>Es falso</p>");
}


Ok, ahora ejecuta index.html en el navegador ...



Bien, ahora practica utilizando los distinto operadores para ir viendo su funcionamiento, crea nuevas variables, súmalas, réstalas, ..., también puedes probar a concatenar cadenas de texto.