Twitter Delicious Facebook Digg Stumbleupon Favorites More

JavaScript: Análise do Código Data e hora no Blog

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.

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.

Um desses códigos que analisei foi o que apresentei no post: Código para Inserir Data e Hora no Blog.

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.

Então, chega de muita conversa e vamos por a mão na massa!

Primeiro vamos dividir o código em sessões, para facilitar nossa compreenção geral:

  • Vale lembra que a ordem que aparecem os códigos aqui não necessariamente é a mesma em que irá aparecer no navegador; isso vai depender do último parâmetro: document.write(), que definirá o que vai aparecer e em que ordem.

 

<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!

0 comentários:

Postar um comentário

Envie um comentário!

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Blogger Templates