Testando e Comparando Valores A Instrução if Um dos recursos mais importantes de uma linguagem de computador é a capacidade de testar e comparar valores, permitindo que seu programa se comporte diferentemente de acordo com o valor armazenado, naquele momento, em determinadas variáveis. A instrução if é a instrução principal condicional no JavaScript. Essa instrução consiste de duas partes: uma condição e uma ação, como mostrado abaixo: if condição verdadeira instrução 1; instrução 2;... A instrução acima testa a condição. Se a condição é verdadeira, o conjunto de instruções entre as chaves é executado. Caso a condição seja falsa, o conjunto de instruções não será executado e sim a instrução que vier depois da instrução if. Observe o exemplo abaixo: O trecho de script acima testa se o conteúdo da variável a é igual a 1. Caso o conteúdo da variável a seja igual a 1, a instrução será executada e, logo depois, a instrução. Caso o conteúdo da variável a seja diferente de 1, somente a instrução será executada. No exemplo anterior vemos somente uma instrução como ação. Caso você queira que um conjunto de instruções seja executado caso a condição seja verdadeira, faça uso de chaves como o exemplo abaixo: window.alert( Você teve sucesso no teste ); E Nemer 1
A palavra-chave else Um recurso adicional da instrução if é a palavra-chave else. Ela diz ao interpretador de JavaScript o que fazer caso a condição não seja verdadeira (ou seja, caso a condição seja falsa). Observe o exemplo abaixo: window.alert( Você teve sucesso no teste ); else window.alert( Você não encontrou o número 1! ); window.alert( Logo, você não teve sucesso no teste ); Operadores condicionais Embora a parte relativa à ação de uma instrução if possa ser constituída de quaisquer das instruções de JavaScript, a parte relativa à condição utiliza expressões condicionais que fazem uso de operadores condicionais. Uma expressão condicional inclui dois valores a serem comparados. Esses valores podem ser variáveis ou até expressões. Obs.: Qualquer lado da expressão condicional pode ser uma variável, uma constante ou uma expressão. Você pode comparar uma variável e um valor ou comparar duas variáveis. (Você pode comparar duas constantes, mas normalmente não há nenhuma razão para isso.) Entre dois valores a serem comparados há um operador condicional. Por exemplo, na instrução abaixo, o operador == é utilizado para testar se os dois valores são iguais, ou seja, se o conteúdo de a é igual a 1. Uma variedade de operadores condicionais está disponível. Observe a tabela abaixo, assumindo que var1 recebeu o valor 3 e var2 recebeu o valor 4. E Nemer 2
Operador Descrição condição = verdadeiro igual a (= =) Retorna verdadeiro se os operandos são iguais. Se os operandos não forem do mesmo tipo, o JavaScript tenta converte-los para um tipo apropriado que possibilite a comparação. 3 = = var1 "3" = = var1 3 = = '3' não igual a (! =) Estritamente igual ( = = = ) Estritamente não igual a (! = = ) Maior do que ( > ) Maior do que ou igual a ( > = ) Menor do que ( < ) Menor do que ou igual a ( < = ) Retorna verdadeiro se os operandos não são iguais. Se os dois operandos não são do mesmo tipo, JavaScript tenta converte-los para um tipo apropriado que possibilite a comparação. Retorna verdadeiro se os operandos são iguais e do mesmo tipo. Retorna verdadeiro se os operandos não são iguais e/ou não são do mesmo tipo. maior do que o operando da direita. maior do que ou igual ao operando da direita. menor do que o operando da direita. menor do que ou igual ao operando da direita. var1! = 4 var2! = 3 3 = = = var1 var1! = = 3 3! = = 3 var2 > var1 var2 > = var1 var1 > = 3 var1 < var2 var1 < = var2 var2 < = 5 Obs.: Não confunda o operador de igualdade (= =) com o operador de atribuição (=). Operadores lógicos Os operadores lógicos são usados tipicamente com valores Booleanos (verdadeiro e falso) e retornam um valor Booleano (verdadeiro ou falso). Operador Uso Descriçào && expr1 && expr2 (E lógico) Retorna verdadeiro somente se os dois operandos são verdadeiros; de outra forma, retorna falso. expr1 expr2 (OU Lógico) Retorna falso somente se os dois operandos são falsos; de outra forma retorna verdadeiro.!! expr1 (Não lógico) Retorna verdadeiro se o operando for falso; de outra forma retorna verdadeiro. Combinando condições com operadores lógicos Freqüentemente, você vai querer verificar uma variável para mais de um possível valor ou verificar mais de uma variável de uma vez. Por exemplo, as duas seguintes instruções verificam condições diferentes e utilizam a mesma ação: if (phone= = ) window.alert ( entrada incompleta! ); if (email = = ) window.alert ( entrada incompleta! ); E Nemer 3
Utilizando um operador lógico você pode combina-las em uma única instrução: if (phone = = email = = ) window.alert ( entrada incompleta! ); A instrução acima utiliza o operador lógico OU, ou OR, ( ) para combinar as condições. Traduzido para a linguagem natural, isso seria se o número de telefone ou o endereço de correio eletrônico estiver em branco, exiba uma mensagem de erro. Usando o operador lógico E, ou AND, ( && ), teríamos a seguinte situação: if (phone = = && email = = ) window.alert ( entradas incompletas! ); Essa instrução utiliza && (E) em vez de (OU), então a mensagem de erro somente será exibida se ambos, o endereço de correio eletrônico e a variável de número de telefone, estiverem em branco. (Nesse caso particular, Or é a melhor escolha.) O terceiro operador lógico é o! (Não lógico). Ele pode ser utilizado para inverter uma expressão em outras palavras, uma expressão verdadeira se tornaria falsa e uma falsa se tornaria verdadeira, como mostrado no exemplo abaixo: if (phone! = ) window.alert ( O campo de telefone foi preenchido ); Utilizando expressões condicionais O JavaScript fornece um tipo de abreviação de expressão condicional que você pode utilizar para tomar decisões rápidas. Observe a sintaxe abaixo: variável = (condição )? valor se condição verdadeira : valor se condição falsa; A instrução acima atribui um de dois valores à variável: um se a condição for verdadeira e outro se a condição for falsa, conforme mostrado no exemplo abaixo: valor = (a = = 1 )? 1 : 0 ; Esta instrução é equivalente a : valor=1; else valor=0; Em outras palavras, o valor depois do ponto de interrogação (? ) será utilizado se a condição for verdadeira e o valor depois dos dois pontos ( : ) será utilizado se a condição for falsa. Os dois pontos representam a parte else dessa instrução e, como a parte else da instrução if, é opcional. E Nemer 4
Um outro exemplo seria um script que contivesse um contador de número de palavras e que o conteúdo deste contador tivesse que ser exibido no vídeo. Neste caso poderíamos utilizar a seguinte instrução: document.write ( Encontrou-se + contador+ ( (contador = = 1 )? palavra. : palavras. )) ; Esta instrução imprimirá a mensagem Encontrou-se 1 palavra caso o conteúdo da variável contador seja igual a 1; e imprimirá a mensagem Encontrou-se n palavras caso o conteúdo da variável contador seja igual a n e n seja maior do que 1. Utilizando múltiplas condições com switch Você, em algumas situações, precisará utilizar várias instruções if em uma linha para testar condições diferentes. A listagem abaixo mostra um exemplo: <title> Exemplo utilizando múltiplas instruções if </title> </head> <body> <h1> Exemplo de Resposta do Usuário </h1> Entre com a home-page que você deseja acessar <br> <script language="javascript"> destino = window.prompt ("Qual a página desejada?"); if (destino =="microsoft") window.location="http://www.microsoft.com"; if (destino =="netscape") window.location="http://www.netscape.com"; if (destino =="yahoo") window.location="http://www.yahoo.com"; </script> </body> </html> E Nemer 5
Embora este seja uma maneira compacta e bonita, este método pode ficar confuso caso cada instrução if tenha um bloco de código com várias instruções. O JavaScript inclui a instrução switch que permite combinar vários testes da mesma variável ou expressão em um único bloco de instruções. O exemplo abaixo mostra a aplicação da instrução switch. <html> <head> <title> Exemplo de Tratamento de Resposta do Usuário </title> </head> <body> <h1> Exemplo de Resposta do Usuário </h1> Entre com a home-page que você deseja acessar <br> <script language="javascript"> destino = window.prompt ("Qual a página desejada?"); switch (destino) case "Netscape": window.location="http://www.netscape.com"; break; case "Microsoft": window.location="http://www.microsoft.com"; break; case "Yahoo": window.location="http://www.yahoo.com"; break; default: window.location="http://www.mcp.com"; </script> </body> </html> A instrução switch tem vários componentes: A instrução inicial switch. Essa instrução inclui o valor a testar (nesse caso, destino) entre parênteses; As chaves ( e ) incluem a instrução switch, semelhante a uma função ou uma instrução if; Uma ou mais instruções case. Cada uma dessas instruções especifica um valor para comparar com o valor especificado na instrução switch. Se o valor testado corresponder ao valor especificado no case, as instruções daquele case serão executadas, até que a instrução break seja encontrada; Caso o valor testado não corresponda a nenhum valor especificado nos cases, as instruções contidas na opção default serão executadas (a opção default é opcional). E Nemer 6