Operadores relacionais ou de comparação são usados pra comparar valores contidos ou não em variáveis, retornando um resultado booleano. Isso é pra ver se valores são iguais, diferentes, maiores ou menores, geralmente associados a estruturas de repetição ou condicionais.
Veja os operadores em Javascript:
| Operador Aritmético | Significado |
|---|---|
| == | Igualdade. Não leva em conta os tipos de dados. |
| === | Idêntico. Leva em conta os tipos de dados (sem conversão). |
| != | Diferente. Não leva em conta os tipos de dados. |
| !== | Não Idêntico. Leva em conta os tipos de dados (sem conversão). |
| > | Maior. Não leva em conta os tipos de dados. |
| < | Menor. Não leva em conta os tipos de dados. |
| >= | Maior ou Igual. Não leva em conta os tipos de dados. |
| <= | Menor ou Igual. Não leva em conta os tipos de dados. |
Exemplo:
var logico = true;
var num = 10;
var texto = "10";
document.write(logico + "<br/>");
logico = num == texto;
document.write("10 == '10' " + logico + "<br/>");
logico = num === texto;
document.write("10 === '10' " + logico + "<br/>");
logico = num != texto;
document.write("10 != '10' " + logico + "<br/>");
logico = num !== texto;
document.write("10 !== '10' " + logico + "<br/>");
logico = num > texto;
document.write("10 > '10' " + logico + "<br/>");
logico = num < texto;
document.write("10 < '10' " + logico + "<br/>");
logico = num >= texto;
document.write("10 >= '10' " + logico + "<br/>");
logico = num <= texto;
document.write("10 <= '10' " + logico + "<br/>");
Os operadores lógicos são usados para que seja possível tomar decisões usando valores booleanos true e false. Geralmente são aplicadas em estruturas de controles adicionais e estruturas de repetição. Os operadores lógicos são os seguintes:
| Operador | Operação | Significado |
|---|---|---|
| && | AND | E |
| || | OR | Ou |
| ! | NOT | Não |
O operador AND retorna true se ambos os operandos envolvidos forem verdadeiros, em outro caso retorna falso, como podem ver:
| Operando 1 | Operando 2 | Resultado |
|---|---|---|
| false | false | false |
| false | true | false |
| true | false | false |
| true | true | true |
Nesse exemplo, no primeiro teste retorna true, depois da alteração da variável, ele retornou false, veja:
var numero;
var num1 = 40;
var num2 = 50;
numero = (num1 != num2) && (num1 < num2);
document.write(numero + "<br/>");
document.write("Alterando num1: ");
num1 = 50;
numero = (num1 != num2) && (num1 < num2);
document.write(numero + "<br/>");
Também é possível utilizar o operador && para retornar o valor de um dos operandos, ao invés de um valor booleano, dependendo do resultado, por exemplo:
variavel = operando1 && operando2;
Nesse caso a variável receberá o valor do operando1 caso ele seja falso, e do operando2 caso seja verdadeiro, por exemplo:
var numero;
var a = 15;
var num1 = 20;
var num2 = 35;
numero = (num1 != num2) && (a);
document.write(numero + "<br/>");
numero = (num1 == num2) && (a);
document.write(numero + "<br/>");
O operador OR retorna true se um dos valores pelo menos são verdadeiros, só retorna false se ambos forem falsos, como podem ver:
| Operando 1 | Operando 2 | Resultado |
|---|---|---|
| false | false | false |
| false | true | true |
| true | false | true |
| true | true | true |
Nesse exemplo, no primeiro teste também retorna true, depois da alteração da variável, ele também retornou false, veja:
var numero;
var num1 = 40;
var num2 = 50;
numero = (num1 != num2) || (num1 < num2);
document.write(numero + "<br/>");
document.write("Alterando num1: ");
num1 = 50;
numero = (num1 != num2) || (num1 < num2);
document.write(numero + "<br/>");
Também é possível utilizar o operador || para retornar o valor de um dos operandos, ao invés de um valor booleano, dependendo do resultado, por exemplo:
variavel = operando1 || operando2;
Nesse caso a variável receberá o valor do operando1 caso ele seja verdadeiro, e do operando2 caso seja falso (o contrário do AND), por exemplo:
var numero;
var a = 15;
var num1 = 20;
var num2 = 35;
numero = (num1 != num2) || (a);
document.write(numero + "<br/>");
numero = (num1 == num2) || (a);
document.write(numero + "<br/>");
O operador NOT simplesmente inverte o valor booleano do operando, por isso chamado de "Operador da Negação", age apenas sobre um valor lógico, como podem ver:
| Operando | Resultado |
|---|---|
| false | true |
| true | false |
Nesse exemplo, no primeiro teste também retorna true, depois da alteração da variável, ele também retornou false, veja:
var numero;
var num1 = 40;
var num2 = 50;
numero = !(num1 != num2);
document.write(numero + "<br/>");
numero = !(num1 == num2);
document.write(numero + "<br/>");
PS: Também existe o XOR/^(xor ou ou exclusivo), que recebe os mesmos valores do OR, menos quando todas as premissas são verdadeiras (pode ser uma coisa ou outra, mas nunca as duas. De certa forma, ele retorna false pra iguais e true pra diferentes):
| Operando 1 | Operando 2 | Resultado |
|---|---|---|
| true | true | false |
| false | true | true |
| true | false | true |
| false | false | false |
PS: Temos também o operador ternário, que usa : e ?. Esse operador faz comparações simples e mostra resultados de acordo com o resultado do mesmo. O que estiver antes da interrogação for verdadeiro, receberá o primeiro valor do lado direito, senão receberá o segundo do lado direito. Veja um exemplo:
var res = (1 > 2) ? "Certo" : "Errado";
alert("Resultado: " + res);
Outro exemplo:
var idade = parseInt(prompt("Digite sua Idade", "0"));
var maior = (idade >= 18) ? "É de Maior!" : "É de Menor!";
document.write(maior);
O condicional simples é feito apenas com a declaração if (significando "se") é usado para especificar um bloco de código que deverá ser executado, ao retornar true. Veja um exemplo para ver se o número é par:
var a = 10;
if(a % 2 == 0) {
alert("O número é par!");
}
O condicional composto é feito com o if junto com o else (significando "senão"). O else se usa para executar um segundo bloco de código ao retornar false, veja o exemplo baseado no código anterior:
var a = 10;
if(a % 2 == 0) {
alert("O número é par!");
}
else {
alert("O número é ímpar!");
}
Como visto anteriormente, o condicional composto é usado muito com o métodos confirm.
Existe ainda o condicional composto alinhando, que entre o if e o else tem o else if. O else if executa um segundo código ao if retornar false, antes de executar o else, por exemplo:
var a = 20;
if(a > 20) {
alert("Número maior que 20!");
}
else if(a < 20) {
alert("Número menor que 20!");
}
else {
alert("Número exato!");
}
A declaração condicional switch (chaveamento) é usada quando é preciso realizar diferentes ações baseadas em distintas condições. Pra simplificar o código, geralmente se usa no lugar de um condicional alinhado.
O case é o valor comparado com a expressão, se corresponder, o código associado será executado. O break garante que a estrutura seja finaliza ao encontrar uma correspondência. E o default é o bloco de códigos que será executado se nenhum caso corresponder à expressão.
Veja que depois do case e do default, nesse caso, se usa dois pontos :, e que ele diferencia minúsculas e maiúsculas, veja um exemplo de estrutura condicional:
var material = prompt("Digite o nome de um material pra desenhos!");
switch(material) {
case "Lápis":
alert("Necessário para esboços!");
break;
case "Nanquim":
alert("Necessário para arte-final!");
break;
case "Papel":
alert("Necessário para os desenhos!");
break;
default:
alert("Função desconhecida!");
break;
}
O case só suporta um valor, no entanto, quando queremos citar mais de um caso, podemos fazer algo como nesse exemplo:
var letra = prompt("Digite uma única letra: ");
switch(letra.toUpperCase()) {
case "A":
case "E":
case "I":
case "O":
case "U":
alert(letra + " é vogal!");
break;
case "H":
case "W":
case "Y":
alert(letra + " é semivogal!");
break;
default:
alert(letra + " é consoante!");
break;
}
Em determinados casos pode ser necessário repetir um programa diversas vezes, nesse caso devemos usar um loop para efetuar essa repetição de código quantas vezes forem necessárias. Também são chamados de laços de repetição.
A repetição while (enquanto) realiza um teste lógico no início do loop, e cada vez que o teste retornar verdadeiro, os comandos associados ao laço são executados. Se retornar falso, o laço é encerrado e o processamento volta para o fluxo principal do programa. Veja um exemplo:
var numero, contador = 0;
numero = parseInt(prompt("Digite um número qualquer entre 50 e 500", "0"));
if(numero < 50 || numero > 500) {
alert("Valor fora do intervalo especificado!");
}
else {
while(contador <= numero) {
document.write(contador + "<br/>");
contador++;
}
}
Outra forma de criar repetição é a do while, significando repita. Diferente do while, a do while é colocada no final, praticamente o contrário dela. Veja um exemplo:
var contador = 1;
do {
document.write(contador + "<br/>");
contador++;
}
while(contador <= 50);
PS: Pode ver que, por esse fator, o comando do será executado, e só depois ele testará, independente do valor recebido. O que garante que pelo menos uma vez, o bloco de comandos é executado.
Em laços while, podemos utilizar o break para interromper um laço, ou o continue que interrompe uma execução mas continua com o laço, assim:
var contador = 0;
while(true) {
contador++;
if(contador == 10 || contador == 20) {
continue;
}
else if(contador == 30) {
break;
}
document.write(contador + "<br/>");
};
A estrutura for é usada para construir estruturas de loop nos casos para que se conhecem de antemão o número de repetições que devem ser realizadas (como 10 vezes, 20 vezes, etc.). Veja um exemplo:
var numero = parseInt(prompt("Digite um número qualquer entre 50 e 500", "0"));
if(numero < 50 || numero > 500) {
alert("Valor fora do intervalo especificado");
}
else {
for(let contador = 1; contador <= numero; contador++) {
document.write(contador + "<br/>");
}
}