Criando um script simples

Transcrição

Aula de JavaScript
05/03/10
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:
if (a = = 1)
window.alert(“Encontrou o número 1!”);
window.alert(“Teste terminado”);
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 window.alert(“Encontrou o número 1!”); será executada e,
logo depois, a instrução window.alert(“Teste terminado”);. Caso o conteúdo da variável a seja
diferente de 1, somente a instrução window.alert(“Teste terminado”); 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:
if (a = = 1)
{
window.alert(“Você teve sucesso no teste”);
}
E Nemer
1
Aula de JavaScript
05/03/10
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:
if (a = = 1)
{
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.
if (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
Aula de JavaScript
Operador
igual a (= =)
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 ( < = )
05/03/10
Descrição
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.
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.
Retorna verdadeiro se o operando da esquerda é
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.
condição = verdadeiro
3 = = var1
"3" = = var1
3 = = '3'
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
expr1 && expr2
||
expr1 || expr2
!
! expr1
Descriçào
(E lógico) Retorna verdadeiro somente se os dois operandos
são verdadeiros; de outra forma, retorna falso.
(OU Lógico) Retorna falso somente se os dois operandos são
falsos; de outra forma retorna verdadeiro.
(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
Aula de JavaScript
05/03/10
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 :
if (a = = 1)
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
Aula de JavaScript
05/03/10
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
Aula de JavaScript
05/03/10
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:

E Nemer
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).
6