Javascript Básico para Iniciantes: Sintaxe, Variáveis, Funções, Elementos, Eventos, Objetos e Arrays.

1. JAVASCRIPT
TATIANE AGUIRRES NOGUEIRA

2. SEGUNDO O MOZILLA DEVELOPER O
JAVASCRIPT É
•Orientado a objetos
•Pequeno e leve
•Dinâmico
•Mais conhecido como a linguagem de script
para páginas Web

3. SINTAXE BÁSICA
•JavaScript é case-sensitive e usa o conjunto de
caracteres Unicode
•Instruções são separadas por um ponto e vírgula (;)
•O código fonte dos scripts em JavaScript são lidos
da esquerda para a direita

4. SINTAXE BÁSICA E COMENTÁRIOS

5. VARIÁVEIS
• São valores nomeados que guardam algum tipo de informação. Ex:
var numero = 100;
• var - é a palavra chave em JavaScript para declarar uma variável.
• numero - é o nome da variável.
• = - é o operador que recebe o valor em seguida.
• 100 - é o valor guardado dentro da variável.

6. FUNÇÕES
• As funções são blocos de código que podem ser nomeados e reutilizados. Ex:
function adicionarDoisNumeros (x, y) { function
minhaFuncao () {
return x + y;
}
}
• function - é a palavra chave para iniciar a declaração de uma função.
• adicionarDoisNumero - é o nome da função.
• (x, y) - são parametros, nomes variáveis para as entradas que a função aceitará.
• return - é a palavras chave que a função nos retorna. Neste caso, o valor
retornado é a soma de x e y.

7. ELEMENTOS
• Encontrando elementos HTML:
Método Descrição
document.getElementById Encontrar um elemento pelo id
Ex: var meuElemento = document.getElementById(“idDoElemento");
document.getElementsByTagName Encontrar um elemento pelo nome da tag
Ex: var paragrafo = document.getElementsByTagName("p");
document.getElementsByClassName Encontrar um elemento pelo nome da class
Ex: var frutas = document.getElementsByClassName("fruta");

8. ELEMENTOS
• Alterando elementos HTML:
Método Descrição
element.innerHTML = novo conteúdo
HTML
Altera o HTML interno de um elemento
element.attribute = novo valor Alterar o valor do atributo de um elemento
HTML
element.setAttribute(atributo, valor) Alterar o valor do atributo de um elemento
HTML
element.style.property = novo estilo Alterar o estilo de um elemento HTML

9. EVENTOS
• Eventos HTML são ações que acontecem com elementos HTML. Quando o
JavaScript é usado em páginas HTML, o JavaScript pode "reagir" nesses
eventos.
Evento Descrição
onchange 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 pressiona uma tecla do teclado
onload O navegador terminou de carregar a página

10. EVENTOS
Saída no navegador:

11. OBJETOS
Objeto Métodos Propriedades
carro.nome = Fiat carro.iniciar()
carro.modelo = 500 carro.dirigir()
carro.peso = 850kg carro.freiar()
carro.cor = branco carro.parar()

12. OBJETOS
Saída no navegador:

13. ARRAYS
• É uma lista de zero ou mais expressões
• Cada uma delas representa um elemento do array
• Inseridas entre colchetes
• Seu comprimento é definido com o número de elementos especificados

14. VÍRGULAS EXTRAS EM ARRAY LITERAL
• fish[0] é "Lion"
• fish[1] é undefined
• fish[2] é "Angel"

15. EXERCÍCIOS
https://github.com/tatianeaguirres/exercicios-javascript