Atualmente, estou lendo um livro sobre JavaScript: “Faça um Site – JavaScript Orientado por Projeto – Scripts baseado em Objetos” de Carlos A. J. Oliviero da editora Érica, de 2001.
O problema é que o livro é de 2001, meio antigo em se tratando de internet e informática, principalmente sobr linguagens de programação. Embora tenha me dado um bom suporte aos conhecimentos iniciais, muitos dos códigos que tentei colocar em prática não funcionáram.
Então, passei a pegar códigos JavaScript na internet e a analisá-los, linha por linha para aprender e, claro, utilizando o livro em caso de dúvidas ou esquecimento de algum parâmetro ou método.
Neste post, vamos analisar esse código para vermos como ele funciona e quais são suas sessões. Tenho certeza de que depois disso, JavaScript não será tão difícil assim e rumar para linguagens como PHP, ASP.NET e JAVA será o próximo passo rumo ao mundo da programação web.
Primeiro vamos dividir o código em sessões, para facilitar nossa compreenção geral:
| <script type="text/javascript" language="JavaScript"> | Início do código |
| var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var timeValue = "" + ((hours >12) ? hours -12 :hours)
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += (hours >= 12) ? " PM" : " AM"
timerRunning = true; | __________________________
Inserção de variáveis referentes ao horário. |
| mydate = new Date();
myday = mydate.getDay();
mymonth = mydate.getMonth();
myweekday= mydate.getDate();
weekday= myweekday;
myyear= mydate.getYear();
year = myyear | __________________________
Definição dos métodos que chamarão o dia, o mês e o ano. |
| if(myday == 0)
day = " Domingo, "
else if(myday == 1)
day = " Segunda, "
else if(myday == 2)
day = " Terça, "
else if(myday == 3)
day = " Quarta, "
else if(myday == 4)
day = " Quinta, "
else if(myday == 5)
day = " Sexta, "
else if(myday == 6)
day = " Sábado, " | __________________________
Utilização dasinstruções condicionais if e else para definir o dia da semana. EX: Testamos mydy=xx
Se myday=0 então domingo, caso contrário, myday==x+1?
Se mayday==1, então Segunda, caso contrário, mayday==x+1+1... |
| if(mymonth == 0)
month = " de Janeiro de "
else if(mymonth ==1)
month = " de Fevereiro de "
else if(mymonth ==2)
month = " de Março de "
else if(mymonth ==3)
month = " de April de "
else if(mymonth ==4)
month = " de Maio de "
else if(mymonth ==5)
month = " de Junho de "
else if(mymonth ==6)
month = " de Julho de "
else if(mymonth ==7)
month = " de Agosto de "
else if(mymonth ==8)
month = " de Setembro de "
else if(mymonth ==9)
month = " de Outubro de "
else if(mymonth ==10)
month = " de Novembro de "
else if(mymonth ==11)
month = " de Dezembro de " | __________________________
Utilização dasinstruções condicionais if e else para definir o mês.
Ex: Testamos month==x
Se month==0 então aparecerá “ de Janeiro de “, caso contrário o código passará para o próximo teste. |
| document.write( day + myweekday + month + year + " - " + timeValue); | __________________________
Esse parâmetro imprime no browser o que está entre parênteses. |
| </script> | __________________________
Fim do código |
Agora, vamos analisar um pouco melhor cada etapa do código acima:
Etapa 1:
<script type="text/javascript" language="JavaScript">
Essa linha de código indica o início de um script em JavaScript. Aqui não tem muito o que se dizer. Basta sempre escrever do jeito que está sendo mostrado.
Etapa 2:
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var timeValue = "" + ((hours >12) ? hours -12 :hours)
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += (hours >= 12) ? " PM" : " AM"
timerRunning = true;
Nessa sessão temos a declaração das variáveis now, hours, minutes e timeValue, relacionados à horas, minutos. Refere-se à ultima parte do script: Ex.: 3:19 PM.
Uma variável em JavaScript é como na matémática. Imagine que X=Y + 2; sempre que o valor de Y mudar a variável X também mudará.
Em timeValue += (hours >= 12) ? " PM" : " AM" o programa pergunta: hours >= 12? Caso afirmativo, imprimirá PM; caso negativo, aparecerá AM.
Etapa 3:
mydate = new Date();
myday = mydate.getDay();
mymonth = mydate.getMonth();
myweekday= mydate.getDate();
weekday= myweekday;
myyear= mydate.getYear();
year = myyear
Nesse sessão temos a declaração das variáveis referentes ao dia, mês e ano. Algo muito parecido como na sessão anterior.
Etapa 4:
if(myday == 0)
day = " Domingo, "
else if(myday == 1)
day = " Segunda, "
else if(myday == 2)
day = " Terça, "
else if(myday == 3)
day = " Quarta, "
else if(myday == 4)
day = " Quinta, "
else if(myday == 5)
day = " Sexta, "
else if(myday == 6)
day = " Sábado, "
Nessa etapa são utilizados os parâmetros if e else if para indicar o dia da semana numa escala de 0 a 6. O script lê da seguinte forma:
Se (comando if) myday é igual a 0, então será mostrado Domingo;
Caso contrário (comando else if) myday = 1?. Se afirmativo, sera mostrado Segunda;
Caso contrário myday = 2?. Se afirmativo, será mostrado Terça.
Caso contrário… e assim sucessivamente.
Etapa 5:
if(mymonth == 0)
month = " de Janeiro de "
else if(mymonth ==1)
month = " de Fevereiro de "
else if(mymonth ==2)
month = " de Março de "
else if(mymonth ==3)
month = " de April de "
else if(mymonth ==4)
month = " de Maio de "
else if(mymonth ==5)
month = " de Junho de "
else if(mymonth ==6)
month = " de Julho de "
else if(mymonth ==7)
month = " de Agosto de "
else if(mymonth ==8)
month = " de Setembro de "
else if(mymonth ==9)
month = " de Outubro de "
else if(mymonth ==10)
month = " de Novembro de "
else if(mymonth ==11)
month = " de Dezembro de "
Nessa etapa ocorre a mesma coisa da etapa anterior, só que desta vez para se definir o mês do ano:
Se (comando if) mymonth é igual a 0, então será mostrado de Janeiro de;
Caso contrário (comando else if) mymonth = 1?. Se afirmativo, sera mostrado de Fevereiro de;
Caso contrário mymonth = 2?. Se afirmativo, será mostrado de Março de.
Caso contrário… e assim sucessivamente.
Etapa 6 (FINAL):
document.write( day + myweekday + month + year + " - " + timeValue);
Aqui é onde tudo acontece. O parâmetro document.write() imprime na tela do seu navegador toda a codificação acima, de acordo com a ordem que está definida entre os parênteses.
O resultado será:
“dia da semana” + “dia do mes” + “ de ‘mês’ de” + “ano” + “-“ + “hora AM ou PM”
Bom, a explicação foi muito simples e básica. Espero que tenha sido útil para todos. Dúvidas? Pergunte nos comentário. Até a próxima!
Willian Coutinho
Para você que se interessa em aprender sobre programação web, códigos, scripts e etc, vou compartilhar um pouco de meus estudos. Nós, neste post vamos analisar um código JavaScript para compreendermos a linguagem e sua lógica. Essa é uma boa pedida para os inciantes no assunto.