Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Javascript Eventos, Métodos e Funções

593 views

Published on

Material de Apoio para as aulas de Programação de Internet I, conceitos básicos sobre Eventos, Métodos e Funções em JavaScript.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Javascript Eventos, Métodos e Funções

  1. 1. TÉCNICAS DE PROGRAMAÇÃO PARA INTERNET I 2. MÉTODOS, EVENTOS E FUNÇÕES EM JAVASCRIPT
  2. 2. INTRODUÇÃO JavaScript é uma linguagem de programação mais popular no desenvolvimento web, pois é suportada por todos os navegadores, a linguagem é responsável por praticamente qualquer tipo de dinamismo que desejamos em uma página web. Desta forma com criatividade pode-se por exemplo criar jogos, utilizar recursos como formulários dinâmicos, gráficos, efeitos nos botões, ou seja mais interatividade com o usuário
  3. 3. CARACTERÍSTICA DA LINGUAGEM • É uma linguagem de scripting, ou seja, é uma linguagem de programação que permite ao programador controlar uma ou mais aplicações de terceiros. Em JavaScript pode-se controlar alguns comportamentos dos navegadores através de trechos de códigos que são enviados na página HTML. • Outra característica da linguagem JavaScript é que são interpretadas, ou seja, não dependem de compilação para serem executadas. O código é interpretado conforme é lido pelo navegador, linha por linha e assim como o HTML.
  4. 4. RELEMBRANDO – A TAG SCRIPT • A execução é instantânea por isso ao inserirmos um código JavaScript em uma página web, é necessário utilizar a tag <script></script> <script> alert (“Olá, Mundo!”); </script>
  5. 5. EVENTOS • Eventos HTML são "coisas" que acontecem a elementos HTML. • Quando JavaScript é usado em páginas HTML, JavaScript pode "reagir" sobre esses eventos.
  6. 6. EVENTOS MAIS COMUNS Evento Descrição em mudança Um elemento HTML foi alterado onclick O usuário clica em um elemento HTML onmouseover O usuário move o mouse sobre um elemento HTML onmouseout O usuário move o mouse longe de um elemento HTML onkeydown O usuário aperta uma tecla do teclado carregando O navegador tenha terminado o carregamento da página
  7. 7. EXEMPLOS: Neste exemplo temos um id (identificador com o nome ‘demo’); Um button (botão que ao ser acionado irá demostrar a data e a hora local). Onclick = document.getElement.ById(‘demo’).innerHTML recebe uma função chamada Date()
  8. 8. Neste exemplo temos um id (identificador com o nome ‘demos’); Um button (botão que ao ser acionado irá demostrar uma informação). Onclick = document.getElement.ById(‘demos’).innerHTML recebe uma string com a mensagem: “Hello JavaScript!”
  9. 9. MÉTODOS Diferente de muitas linguagens orientadas a objetos, não há distinção entre a definição de uma função e a definição de um método no JavaScript. A distinção ocorre durante a chamada da função; a função pode ser chamada como um método. Quando uma função é chamada como método de um objeto, a keyword this da função é associada àquele objeto via tal invocação.
  10. 10. Neste exemplo o resultado será: “Hoje é dia: 01/01/2001”.
  11. 11. MÉTODO GETDAY O resultado será o número “6”.
  12. 12. NESTE EXEMPLO DE MÉTODOS TEMOS UMA FUNÇÃO QUE DIZ: “OLÁ” A PESSOA
  13. 13. Em JavaScript métodos são funções normais de objetos que são vinculados a uma classe/objeto como uma propriedade, o que significa que eles podem ser invocados "fora de contexto" . Considere o seguinte exemplo de código:
  14. 14. FUNÇÕES Se necessitar guardar um código para ser executado em outra ocasião, por exemplo, quando o usuário clicar em um objeto ou melhor, um botão, é necessário utilizar dois recursos do JavaScript no navegador, ou seja, uma Função.
  15. 15. Criando uma função simples como esta, armazenamos o que estiver dentro dela para ser executado quando for chamada na função. Veja o exemplo a seguir:
  16. 16. Neste exemplo, a função armazena a mensagem que será exibida após o usuário clicar no botão “Tente isto”
  17. 17. Neste exemplo, a função exibe duas mensagens, mensagem1: “Palmeiras”, mensagem2: “Sempre Campeão”.
  18. 18. BIBLIOGRAFIAS E REFERENCIAS: • https://www.w3schools.com/js/js_events.asp • https://developer.mozilla.org/pt- BR/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript
  19. 19. OBRIGADO! Clayton de Almeida Souza Graduado em Sistemas de Informação pela Universidade Bandeirantes de São Paulo – UNIBAN e Especialista em Sistemas e Desenvolvimento Web pela Universidade Nove de Julho – UNINOVE. Contatos: Blog: http://professorclaytonsouza.blogspot.com E-mail: claytonn_Souza@Hotmail.com Site pessoal (em breve): www.claytondeasouza.com.br

×