Introdução ao JavaScript - Parte 1

Hoje teremos um post sobre JavaScript pra variar um pouco. Farei este post em duas partes. Na primeira vou fazer uma introdução sobre a linguagem dando alguns conteitos básicos e também falarei sobre variáveis e eventos. Na próxima parte teremos objetos importantes, suas propriedades e também sobre semelhanças com a linguagem Java.

O que é JavaScript?

De acordo com a famosa enciclopédia digital "JavaScript é uma linguagem de programação criada por Brendan Eich para a Netscape em 1995, que a princípio se chamava LiveScript. A Netscape, após o sucesso inicial desta linguagem, recebeu uma colaboração considerável da Sun, a qual possibilitou posteriormente dizer que o JavaScript é uma linguagem compatível com a linguagem Java, por esta razão, a semelhança dos nomes."

Pontos importantes sobre JavaScript quanto aos tipos:

• fraca - sua tipagem é mutável;
• dinâmica - uma variável pode assumir vários tipos diferentes durante a execução;
• implícita - as variáveis são declaradas sem tipo.

Porque usar JavaScript? JavaScript permite tornar páginas HTML mais dinâmicas. Usamos a linguagem para interagir com a página, validar formulários, etc. Vamos ao que interessa.

10 Perguntas básicas sobre JavaScript

Estas perguntas foram baseadas num quiz disponível aqui. É necessário obter 100% pra dizer que se tem um conhecimento básico sobre JavaScript.

1. Qual elemento é utilizado para os scripts?

Em uma página HTML colocamos os códigos JavaScript dentro de tags script, como mostra o exemplo:

2. Qual é o lugar correto para inserir JavaScript?

Os scripts podem ser inseridos tanto no cabeçalho(head) quanto no corpo(body) da página.

3. Qual a sintaxe para fazer referência a um script externo?

Scripts externos devem ser salvos com a extenção js e podem ser referenciados utilizando o parâmetro src:

4. Arquivos JavaScript externos precisam ter a tag script?

Não, somente códigos.

5. Como escrever um texto na página?

Para escrever na página usa-se document.write:

document.write("Hello World");

6. Como mostrar mensagens utilizando uma caixa de alerta?

Mensagens podem ser exibidas numa caixa de alerta simplesmente chamando:

alert("Hello World");

7. Como criar uma função?

Funções podem ser criadas utilizando a palavra function, veja:

function myFunction()
{
//Códigos da função
}

8. Como chamar uma função?

Funções podem ser chamadas simplesmente digitando seu nome:

myFunction()

9. Como abrir uma janela?

Pode-se abrir uma janela chamando window.open:

window.open("http://marciosouzajunior.blogspot.com");

10. Como colocar uma mensagem de status no navegador?

Mensagens de status são uma propriedade do objeto window e podem ser modificadas diretamente:

window.status = "Mensagem";

Obviamente existe muito mais sobre JavaScript que você deveria saber. Essas perguntinhas foram apenas pra você poder falar com os amigos que sabe alguma coisa de JavaScript. E também se algum dia for fazer uma prova que caia JavaScript, não passe em branco. Vamos ver outras coisas importantes agora.

Variáveis

JavaScript possui 3 tipos de dados: número, caractere e booleano. Não tem segredo. Como já foi dito, as variáveis podem ser declaradas sem um tipo específico. A simples associação de um valor faz com que a variável passe a existir:

x = 2;

E seu tipo pode mudar como quiser:

var x = 2;
alert(x);
x = "texto";
alert(x);

Usar a palavra var é opcional. Usamos apenas quando queremos declarar a variável sem um valor inicial. Se fizermos isto o seu valor será undefined. Também podemos associar um valor null, que é quase a mesma coisa que undefined.
Não tem muito o que falar sobre variáveis em JavaScript, os criadores da linguagem deixaram as coisas bem simples de trabalhar.

Eventos

Eventos são coisas que podem acontecer durante a execução de um programa (neste caso da página). Um clique de mouse, uma caixa que perde o foco, são eventos que podem ocorrer a qualquer momento. Podemos desejar que esses eventos disparem alguma ação. Logo abaixo temos uma lista de eventos que o JavaScript pode capturar e quando eles acontecem:

• onLoad: Quando a página é carregada.
• onUnload: Quando a página é fechada.

Esses dois eventos só ocorrem no body, portanto poderiam chamar alguma ação da seguinte forma:

<_body onload="alert('Oi');">

Todos sabemos que body não tem underline, mas sou obrigado a escrever assim porque mais uma vez o blogger está confundindo as coisas. Espero que todos tenham entendido. Continuando...Agora vamos ver 3 eventos que podem ocorrer em objetos text, select e textarea:

• onChange: Acontece quando o objeto perde o foco e houve mudança de conteúdo.
• onBlur: Acontece quando o objeto perde o foco, independente de ter mudado o conteúdo.
• onFocus: Quando o objeto ganha o foco.

Aqui temos um exemplo:

O próximo evento pode ser usado para text e textarea:

• onSelect: Ocorre quando seleciona parte ou todo texto do objeto.

Os próximos eventos tem a ver com o mouse:

• onClick: Quando o objeto é clicado. Pode acontecer nos objetos button, checkbox, radio, link, reset e submit.
• onMouseOver: Quando passa o mouse sobre o objeto.
• onSubmit: Quando clica no botão submit. Váido somente para forms.

Exemplo:

 Blog do Márcio 

Certamente numa prova de JavaScript teria pelo menos uma questão sobre esses eventos. Principalmente sobre o evento onBlur, porque facilmente alguém acreditaria que um suposto evento onLostFocus estaria certo.

Fim da Parte 1

Bom, ficamos por aqui com esta introdução ao JavaScript. Espero que você possa ter tirado algum proveito do material. Em breve teremos a segunda parte com mais informações sobre os objetos document, window e também sobre semelhanças com a o Java.

Bons estudos!