https://github.com/miguelitodev/javascript-imc

Projeto realizado no Curso de JavaScript: Programando na linguagem da web da Alura
https://github.com/miguelitodev/javascript-imc

alura alura-courses html imc javascript js

Last synced: 2 days ago
JSON representation

Projeto realizado no Curso de JavaScript: Programando na linguagem da web da Alura

• Host: GitHub
• URL: https://github.com/miguelitodev/javascript-imc
• Owner: miguelitodev
• Created: 2021-06-16T15:52:09.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2021-06-17T13:46:21.000Z (over 3 years ago)
• Last Synced: 2023-10-31T23:27:27.454Z (about 1 year ago)
• Topics: alura, alura-courses, html, imc, javascript, js
• Language: JavaScript
• Homepage: https://miguelrisquelme.github.io/javascript-imc/
• Size: 9.77 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Curso de JavaScript: Programando na linguagem da web

## Porque quebrar uma função?

Sabemos que quebrar uma grande função complexa é uma boa prática por causa de diversos fatores, mas podemos citar como os principais deles:

- Dar manutenção ao código fica muito mais fácil, visto que agora podemos examinar vários pequenos blocos , que são muito mais fáceis de compreender do que um grande bloco de texto

- Ao quebrar uma grande função, também estamos deixando ela com menos responsabilidades, com a meta de atingir o ideal de que cada função tenha apenas uma única responsabilidade.

- O código também fica muito mais fácil de testar, pois se temos diversas funções pequenas conseguimos ir testando uma a uma em busca de erros ou bugs do código.

- E por último, a legibilidade do código aumenta muito, pois dando nomes semânticos a cada uma das funções menores conseguimos deixar bem claro o que aquela parte do código deve fazer e facilita o entendimento do todo como um geral.

## Curiosidades

```js

// Previne o comportamento padrão dos eventos, como recarregar a página

event.preventDefault();

```

```js

// this é o cara que é dono do evento acionado

// Nesse caso o dono do evento click é a tabela, logo ela que será removida

tabela.addEventListener("click", function () {

	this.remove();

});

```

## Pontos ressaltados

- Separar a organização de nosso código em arquivos .js

- Importar arquivos .js sempre ao final do body

- A representação do HTML pela variável document

- A função que faz busca querySelector()

- Preferir selecionar por #id ou .classe

- O operador lógico de OU ( || )

- O operador lógico de E ( && )

- Busca de elementos

- Como selecionar diversos elementos com a função querySelectorAll()

- Relembramos um método clássico de iteração com o for

- Vimos como manipular estilos com a propriedade .style

- Vimos que devemos utilizar camelCase quando queremos modificar uma propriedade que tenha duas palavras, como a background-color

- A boa prática de não alterar o estilo diretamente no Javascript e sim modificar as classes dos elementos com a propriedade .classList

## Referências

- Introdução a eventos

- Tipos de eventos

- Validação de forms customizada com HTML e JavaScript | Code/Drops #32

- Como validar os dados de um formulário com JavaScript

- RegExp