Home | Clases | Introducción a las aplicaciones web con HTML5, CSS3 y Javascript | Los operadores en JavaScript

Los operadores en JavaScript


JavaScript puede trabajar, principalmente, con operadores aritméticos, binarios (estos de momento no los vamos a ver) y lógicos.

Operadores aritméticos

Son los que realizan operaciones de tipo aritmético con las variables

Suma +
Se trata de un operador usado para sumar dos valores numéricos o para concatenar
cadenas entre sí o números y cadenas.

<script>
var numero1 = 10;
var numero2 = 31;
var texto1 = "Buenos";
var texto2 = " días";
document.write(numero1 + numero2 + "<br>"); /* resultado: 41 */
document.write(texto1+texto2 + "<br>"); /* resultado: Buenos días */
document.write(numero1+texto2 + "<br>"); /* resultado: 10 días */
</script>


Resta -
Operador usado para restar valores numéricos. Puede actuar sobre un único operando
numérico cambiándole de signo.

<script>
var numero1 = 10;
var numero2 = 31;
var resultado = 0;
resultado = numero1- numero2;
document.write(resultado + "<br>"); /* resultado: -21 */
resultado = -resultado;
document.write(resultado + "<br>"); /* resultado: 21 */
</script>


Producto * y cociente /
Realizan las operaciones aritméticas de multiplicar y dividir dos valores.

<script>
var numero1 = 50;
var numero2 = 4;
document.write(numero1 * numero2 + "<br>"); /* resultado: 200 */
document.write(numero1 / numero2 + "<br>"); /* resultado: 12.5 */
</script>


Resto o módulo %
Calcula el resto de una división.

<script>
var numero1 = 50;
var numero2 = 4;
document.write(numero1 % numero2 + "<br>"); /* resultado: 2 */
</script>


Incremento ++ y decremento --
Estos operadores se usan para incrementar o decrementar en 1 el valor de una variable. Si el operador se antepone a la variable la operación de incremento o decremento es prioritaria sobre cualquier otra.

<script>
var numero1 = 10;
var numero2 = 31;
var resultado = 0;
resultado = numero1++;
document.write("resultado es " + resultado + " y número 1 es " + numero1 + "<br>"); /* resultado es 10 y numero1 ahora vale 11 */
resultado = ++numero2;
document.write("numero2 es " + numero2 + " y resultado es " + resultado + "<br>"); /* numero1 vale 32 y resultado ahora es 32 */
</script>


Operadores compuestos
Los operadores +, -, *, / pueden asociarse con el operador de asignación (=) para cambiar el valor de una variable numérica por incrementándolo, decrementándolo, multiplicándolo o dividiéndolo por un valor. El operador += puede usarse igualmente con variables de tipo cadena.

<script>
var numero1 = 20;
var texto1 = "día";
numero1 += 5;
document.write("Resultado: " + numero1 + "<br>"); /* resultado: 25 */
texto1 += "s";
document.write("Resultado: " + texto1 + "<br>"); /* resultado: días */
</script>


Ejercicios propuestos:

1. Declarando variables para cada número y para el resultado, genera un script que ejecute la siguiente operación y muestre el valor final de la variable resultado en pantalla: 23 + (15 * (3 / 2)) - 10.
2: Réstale 5 al valor de resultado mediante un operador compuesto y muestra el valor final de la variable resultado en pantalla.
3. Decrementa en uno el valor de resultado mediante el operador decremento y muestra el valor final de la variable resultado en pantalla.



Operadores lógicos

Los operadores lógicos se utilizan para realizar comparaciones entre valores, numéricos o no, dando como resultado un valor booleano (true, false).

La operación lógica negación invierte el operando, si es true lo hace false y viceversa.

  • Si se comparan números con cadenas, JavaScript intenta convertir internamente los datos:
  • En los operadores relacionales (>, <, >=, <=) intenta convertir los datos en tipo número.
  • Para los operadores de igualdad (== , !=) intenta convertir los tipos de datos a cadena, número y booleano.
  • Los operadores de identidad (===, !==) no realizan conversión de tipo.

Mayor que >
Compara dos valores y devuelve true si el primero es mayor que el segundo. Compara
tanto números como cadenas.

Menor que <
Compara dos valores y devuelve true si el primero es mayor que el segundo. Compara
tanto números como cadenas.

Mayor o igual >=
Compara dos valores y devuelve true si el primero es mayor o es igual que el segundo.
Compara tanto números como cadenas.

Menor o igual <=
Compara dos valores y devuelve true si el primero es menor o es igual que el segundo.
Compara tanto números como cadenas.

Iguales ==
Compara dos valores y devuelve true si ambos son iguales. Compara tanto números
como cadenas.

Idénticos ===
Similar a == pero también compara el tipo de datos de los operandos. Compara dos valores y devuelve true si el primero es mayor o es igual que el segundo. Compara tanto números como cadenas.

No iguales !=
No identicos !==

Invierten el sentido de las comparaciones iguales == e idénticos === respectivamente.

AND lógico &&
Este operador se utiliza para concatenar comparaciones, es decir, para comprobar varias
condiciones. El resultado sólo será true si todas las comparaciones lo son.

OR lógico ||
Como el anterior, sirve apra realizar comparaciones compuestas y sólo devolverá false
cuando todas las comparaciones los sean. Es decir basta que una comparación sea true
para que devuelva el valor true.

<script>
var diaHoy = 17;
var diaAyer = 16;
var mesHoy = 10;
var mesAyer = 10;
var mesTexto = "10";
var comparacion;

//mayor que
comparacion = diaHoy > diaAyer;
document.write("Resultado: " + comparacion + "<br>"); /* devuelve true */

//menor que
comparacion = diaHoy < diaAyer;
document.write("Resultado: " + comparacion + "<br>"); /* devuelve false */

//mayor o igual
comparacion = mesHoy >= mesAyer;
document.write("Resultado: " + comparacion + "<br>"); /* devuelve true */

//menor o igual
comparacion = mesHoy <= mesAyer;
document.write("Resultado: " + comparacion + "<br>"); /* devuelve true */

//iguales
comparacion = mesHoy == mesAyer;
document.write("Resultado: " + comparacion + "<br>"); /* devuelve true */

//idénticos
comparacion = mesHoy == mesTexto;
console.log(comparacion) /* devuelve true */
comparacion = mesHoy === mesTexto;
document.write("Resultado: " + comparacion + "<br>"); /* devuelve false */

//AND lógico
comparacion = (diaHoy > diaAyer) && (mesHoy == mesAyer);
document.write("Resultado: " + comparacion + "<br>"); /* devuelve true */

//OR lógico
comparacion = (diaHoy > diaAyer) || (diaHoy == diaAyer);
document.write("Resultado: " + comparacion + "<br>"); /* devuelve true */
</script>


Para una mejor comprensión, se propone la visualización de los siguientes videos del canal de YouTube de Ada Lovecode:

Operadores aritméticos
Operadores de asignación
Operadores de cadena
Operadores de comparación
Operadores lógicos


Ejercicios propuestos:

1. Declarar en un script 12 variables con los meses del año y su valor numérico asociado (var enero = 1; var febrero = 2; etc.)
2. Mostrar por consola el resultado de comparar si enero es mayor que diciembre.
3. Mostrar por consola el resultado de comparar si junio es menor que julio.
4. Mostrar por consola el resultado de comparar si marzo es mayor que febrero y septiembre es mayor que octubre.
5. Mostrar por consola el resultado de comparar si marzo es mayor que febrero o septiembre es mayor que octubre.
6. Crea una función que devuelva la media aritmética de 3 valores.
7. Crea un array con 10 nombres de personas.
8. Crea una función que busque un nombre en el array y duevuelva la posición en el array (si lo encuentra) o el texto "El nombre no está en el array".


Fuente: Jose Antonio Rodríguez. Manual de JavaScript

Fecha de publicación: 08/09/2019
Asignaturas: aplicaciones web
Temas: aplicaciones web
Utilizamos cookies propias y de terceros para mejorar su experiencia en la navegación. Al seguir navegando entendemos que acepta su uso.
Si lo desea, consulte nuestras políticas de privacidad y cookies
ENTENDIDO
[X] Cerrar

Contacta conmigo


[X] Cerrar

Acceso alumnos