Logo SatellaSoft



Javascript do básico ao intermediário - if else

Veja como usar as estruturas condicionais de estruturas e usa-las para validações.


Ícone homem Gunnar Correa
Ícone data de publicação 16/03/2016
Ícone quantidade de visualização 2,339
Ícone bandeira do Brasil Português

Estruturas condicionais nos permitem validar diversos tipos de informações, ela funciona como uma pergunta que espera uma resposta e a partir dela executa uma operação. Para entendermos melhor sua funcionalidade, imagine uma determina aplicação que validade se um determinado usuário pode entrar em um evento, para que ele possa entrar sua idade deve ter ou ser maior que dezoito anos, caso seja menor o mesmo não poderá entrar.

Veja na imagem abaixo como isto ficaria em uma aplicação real.

Estruturas Condicionais - Javascript aulas 

Toda condição tem duas alternativas, podendo ser verdadeiras ou falsas, assim como podemos verificar se algo é falso ao invés de verdadeiro invertendo as ordens. Para ficar mais claro, veja as duas condições e sintaxe (forma de como se usa) do IF e ELSE abaixo, neste exemplo verificamos a idade do usuário.

Código 01:

<script>
	var idade = 17;
			
	//Exemplo 1
	if(idade >= 18){
		alert("Permitido");
	}else{
		alert("Negado");
	}
			
	//Exemplo 2
	if(idade < 18){
		alert("Negado");
	}else{
		alert("Permitido");
	}	
</script>

Se a condição do IF não for satisfeita o ELSE é chamado, mas você pode simplesmente ignorar o else, como mostrado no exemplo abaixo.

Código 02:

<script>
			var idade = 17;
			
			//Exemplo 1
			if(idade >= 18){
				alert("Permitido");
			}else
			//Exemplo 2
			if(idade < 18){
				alert("Negado");
			}
</script>

Dentro do IF ficam nossas condições, podendo haver quantas forem necessárias, ou seja, ao invés de perguntar apenas a idade, podemos perguntar se o usuário pagou a entrada, então ficaria como mostrado abaixo.

Código 03:

<script>
			var idade = 18;
			var pagamento = true;
			
			if(idade >= 18 && pagamento == true){
				alert("Permitido");
			}else{
				alert("Negado");
			}
		</script>

Estruturas de Comparações

Assim como em todas as linguagens o IF contém as estruturas de comparações, assim como usamos algumas nos exemplos acima, elas servem para informar qual tipo de verificação que estamos tentando reproduzir. Veja na tabela abaixo os tipos de comparações.

Expressão

Resultado

Expressão

Menor.

If (idade < 18){true}

Maior.

If (idade < 18){true}

<=

Menor ou igual.

If (idade <=< 18){true}

>=

Maior ou igual.

If (idade >= 18){true}

!=

Diferente.

If (idade != 18){true}

==

Igual.

If (idade == 18){true}

 

Podemos fazer diversas comparações com as condições acima, usando qualquer valor em qualquer situação. Até agora comparamos apenas números, mas podemos comparar string (texto) e outros resultados. Veja o exemplo abaixo.

Código 04:

<script>
			var sexo = 'M';
			
			if((13 * 7) > 50){
				alert("Maior que 50");
			}else{
				alert("Menor que 50");
			}
			
			if(sexo == 'M'){
				alert("Homem");
			}else{
				alert("Mulher");
			}
		</script>

Operadores lógicos

Acima usamos mais de uma condição dentro do IF para verificar a total integridade da nossa regra de negócio, assim como mencionado, podemos usar quantas condições forem necessárias. Podemos usar três tidos de operadores lógicos, como mostra a tabela abaixo.

Expressão

Resultado

Expressão

&&

E, As duas condições devem ser satisfeitas.

If (idade < 18 && sexo == ‘F’)

||

Ou, se uma não passar tenta a outra.

If (idade > 18 || sexo == ‘f’)

!

Não, nega a condição. Verdadeiro vira falso.

If (!sexo) {true}

 

Código 05:

<script>
			var idade  = 18;
			var sexo = 'M';
			var pagamento = true;

			if(idade < 18 && sexo == 'F'){
				alert("Permitido");
			}else{
				alert("Negado");
			}
			
			if(idade < 18 || sexo == 'F'){
				alert("Permitido");
			}else{
				alert("Negado");
			}
			
			if(!sexo){
				alert("Pago");
			}else{
				alert("Pendente");
			}
		</script>

Podemos usar as entradas do usuário, retorno de um JSON, AJAX entre outros métodos de retorno dentro do IF, veja abaixo um exemplo que executa a operação de acordo com a condição do usuário.

Código 06:

		<script>
			var idade = prompt("Qual sua idade? ");

			if(idade >= 18){
				alert("Permitido");
			}else{
				alert("Negado");
			}
		</script>

Basicamente a utilização do IF é esta, não há dificuldade muito menos complicação. Recomendo a leitura dos links abaixo para fixar melhor o conteúdo apresentado aqui.

Até a próxima!

Estruturas condicionais: http://olimpiada.ic.unicamp.br/extras/cursoC/Cap05-EstruturasCondicionais-texto.pdf

Tabela da verdade: https://pt.wikipedia.org/wiki/Tabela_verdade

Javascript If...Else Statements: http://www.w3schools.com/js/js_if_else.asp




Sobre o autor


Gunnar Correa

Nome: Gunnar Correa

Site: http://www.gunnarcorrea.com


Autodidata, graduado em Desenvolvimento Web e especialista em Tecnologias na Educação em uma universidade no interior de São Paulo. Comecei meus estudos na área de programação quando ainda era criança, e atualmente estou estudando desenvolvimento de jogos.

Sou o CEO do portal SatellaSoft, criado em 2009 com o intuito de compartilhar conhecimento de forma gratuita e inédita.


Comentários



É necessário estar autenticado para comentar, clique aqui para se registrar ou aqui para acessar a sua conta!