Internet I
Primeiros Passos com JavaScript
Prof. Manoel Afonso
O que é JavaScript
 JavaScript é uma linguagem de programação interpretada;
 Foi originalmente implementada como parte d...
Como usar?
 Assim como tudo no HTML, JavaScript é usado com tags, mais
especificamente a tag <script>
 Abaixo temos um e...
Entendendo Melhor
 Variáveis (var) são elementos que usamos no código para guardar
dados, podemos guardar números, textos...
Funções
 Para executarmos determinada função usando o JavaScript precisamos fazer
functions como no exemplo a seguir:
<sc...
Não entendi o código...
 Cada function tem um nome, e é entre chaves {} que escrevemos tudo que
acontece dentro dela, no ...
E como fazer para a function executar?
 A function precisa ser chamada para que algo seja executado, geralmente nós
chama...
Posso usar dados de um formulário?
 Sim, para pegar dados de um formulário precisamos criar uma variável para
receber ess...
Exemplo de Código
Para entender...
 No código do slide anterior fizemos uma function que pegava o valor
de dois inputs e multiplicava-os, m...
Dúvidas?
Exercício
 Crie um formulário que peça para o usuário o nome dele,
o ano em que ele nasceu e o ano atual, e então calcule...
Próximos SlideShares
Carregando em…5
×

Internet I - Aula 07 - Primeiros Passos com JavaScript

382 visualizações

Publicada em

Ensinando primeiros códigos simples usando JavaScript.

Publicada em: Celular
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Internet I - Aula 07 - Primeiros Passos com JavaScript

  1. 1. Internet I Primeiros Passos com JavaScript Prof. Manoel Afonso
  2. 2. O que é JavaScript  JavaScript é uma linguagem de programação interpretada;  Foi originalmente implementada como parte dos navegadores web para que scripts pudessem ser executados do lado do cliente e interagissem com o usuário;  JavaScript é uma linguagem de programação, então sim, finalmente vocês podem dizer que são programadores o/
  3. 3. Como usar?  Assim como tudo no HTML, JavaScript é usado com tags, mais especificamente a tag <script>  Abaixo temos um exemplo de como usar a tag <script> para calcular dois números: <script> var result = 1 + 2; alert(result); </script>
  4. 4. Entendendo Melhor  Variáveis (var) são elementos que usamos no código para guardar dados, podemos guardar números, textos, e-mails, senhas, e até mesmo fotos;  Sempre ao final de uma linha devemos usar o “;” para indicar que aquele código acabou;  A tag <script> vai separada do corpo e do cabeçalho, ela é uma parte totalmente independente do <body>
  5. 5. Funções  Para executarmos determinada função usando o JavaScript precisamos fazer functions como no exemplo a seguir: <script> function calcular(){ var result = 1 + 2; alert(result); } </script>
  6. 6. Não entendi o código...  Cada function tem um nome, e é entre chaves {} que escrevemos tudo que acontece dentro dela, no caso usamos o exemplo para colocar o calculo;  É no “alert()” que damos a mensagem da resposta para o usuário, existem 3 tipos de opções de mensagem no alert:  Variável: é quando colocamos uma variável no alert, logo será informado o valor que existe dentro daquela variável. Ex: alert(result);  Literal: é um tipo de texto, tudo que é colocado entre “aspas” é um literal, porque é escrito literalmente oque está ali. Ex: alert(“oi, meu nome é Manoel”);  Concatenado: é quando se une um literal a uma variável, geralmente fazemos isso usando o sinal de “+”, o código irá unir o valor que está na variável com o que você escreveu no literal. Ex: alert(“oi, seu resultado é:” + result);
  7. 7. E como fazer para a function executar?  A function precisa ser chamada para que algo seja executado, geralmente nós chamamos ela ao clicar em alguma coisa, para isso temos o atributo “onclick” que podemos colocar em um botão por exemplo: <input type=“submit” onclick=“calcular()” value=“calcule”/>  No caso acima temos um botão, e ao clicar nele você acaba executando o comando que está no onclick, isso chama a function calcular() do nosso código.  Para chamar uma function no onclick é só colocar o nome dela.
  8. 8. Posso usar dados de um formulário?  Sim, para pegar dados de um formulário precisamos criar uma variável para receber esse dado, em seguida usamos um código onde informamos o id do dado que queremos e pronto, temos nosso dado guardado em nossa variável: var meunome = document.getElementById('nome').value;  No caso acima temos a variável “meunome” que está recebendo o valor que está dentro de um input type=“text” que tem a id=“nome”.
  9. 9. Exemplo de Código
  10. 10. Para entender...  No código do slide anterior fizemos uma function que pegava o valor de dois inputs e multiplicava-os, mostrando seu resultado no alert()  No body temos o form onde estão duas caixas de texto para que o usuário insira os números, e um botão onde está nosso onclick para chamarmos nossa function.  Ao clicar no botão a function se ativa, pegando os valores, calculando, e mostrando a resposta para o usuário.
  11. 11. Dúvidas?
  12. 12. Exercício  Crie um formulário que peça para o usuário o nome dele, o ano em que ele nasceu e o ano atual, e então calcule quando anos o usuário tem, ao final do calculo deve ser informado a seguinte frase: “Fulano, você tem X anos!”  Crie um aplicativo de FireFox OS usando este exercício.

×