Aprendendo com Dev Guilherme Machado DEV dezembro 16, 2024 0 Comentários

Aula 1: Introdução ao JavaScript

Hello, world! Seja bem-vindo à primeira aula postada aqui no meu blog. Meu objetivo é compartilhar aprendizados enquanto evoluímos juntos no universo da programação. Vamos começar pelo JavaScript, um dos pilares do desenvolvimento web, e seguir até nos tornarmos desenvolvedores fullstack.

Então, sem mais delongas, bora para o conteúdo!

Antes de mergulhar no JavaScript: Como funciona a Web

Entender como a Web opera é essencial para compreender o papel do JavaScript e os conceitos usados no dia a dia de um desenvolvedor. Vamos explorar isso de forma simples:

1. O Cliente (Front-end):

O cliente é o navegador (Chrome, Firefox, etc.) usado pelo usuário final. Ele faz uma requisição HTTP ao servidor para acessar um site. Pense nisso como pedir: “Ei, servidor, envie os arquivos para exibir esta página.”

2. A Internet (O Transporte):

A internet é o mensageiro que leva os pedidos do cliente até o servidor e traz as respostas de volta. Isso acontece através de protocolos como HTTP ou HTTPS, que definem como as informações viajam.

3. O Servidor (Back-end):

O servidor é onde o site “vive”. Ele processa as requisições do cliente e responde com arquivos como:

HTML: estrutura da página;
CSS: estilo visual;
JavaScript: interação e lógica.

4. O Ciclo de Resposta:

Depois de receber os arquivos, o navegador do cliente renderiza a página. É aqui que o JavaScript entra, rodando diretamente no navegador para adicionar funcionalidades dinâmicas e interatividade.

Exemplo: Requests e Responses

Quando o cliente faz um request (pedido) ao servidor, este responde (response) com os recursos necessários.

Onde entra o JavaScript?

O JavaScript é a mágica que acontece após a página chegar ao cliente. Ele permite:

Um formulário avisar se você esqueceu de preencher algo;
Uma calculadora resolver problemas diretamente no site.

Hoje em dia, o JavaScript também roda no lado do servidor (com Node.js), mas isso é papo para outras aulas.

Pontos Importantes do JavaScript

O JavaScript é uma linguagem versátil, que suporta diferentes paradigmas de programação. Vamos conhecer os principais:

1. Orientação a Objetos (OO):

O que é: Baseado em “objetos”, que possuem propriedades (dados) e métodos (funções).
Importância: Organiza o código e facilita a reutilização.

Conceitos-chave:

Classe: Molde para criar objetos (como uma receita de bolo);
Objeto: Uma instância da classe (o bolo pronto);
Encapsulamento: Esconde detalhes internos e expõe apenas o necessário.

2. Programação Funcional (PF):

O que é: Focado em funções puras (mesmo resultado para os mesmos inputs, sem alterar nada fora dela).
Importância: Cria códigos mais previsíveis e fáceis de testar.

Princípios:

Imutabilidade: Dados originais não são alterados;
Funções puras: Sem efeitos colaterais.

3. Orientação a Eventos:

O que é: Executa código em resposta a eventos (ex.: cliques, envio de formulários).
Como funciona: Usa addEventListener para reagir a eventos como “click” ou “keydown”.

4. Paradigma Assíncrono:

O que é: Lida com tarefas demoradas (ex.: buscar dados de um servidor) sem bloquear o resto do programa.

Conceitos importantes:

Promise: Representa uma tarefa que pode ser concluída no futuro;
Async/Await: Forma moderna de trabalhar com promessas, deixando o código mais legível.

Características da Linguagem:

Tipagem Dinâmica: O tipo da variável é definido pelo valor atribuído;
Tipagem Fraca: Permite, por exemplo, somar uma string com um número sem erro (atenção para evitar problemas!).

Linha do Tempo da História do JavaScript

1995: Brendan Eich cria o JavaScript em 10 dias, inicialmente chamado de Mocha;
1996: Renomeado para JavaScript e incorporado ao Netscape Navigator 2.0;
1997: Padronização como ECMAScript (ES1);
1999: ECMAScript 3 é lançado, trazendo suporte aprimorado a expressões regulares e melhor tratamento de erros;
2005: Surge o Ajax, popularizando o uso do JavaScript para criar experiências mais dinâmicas na web;
2006: Nascimento do jQuery, facilitando a manipulação do DOM;
2009: Surge o Node.js, trazendo o JavaScript para o back-end;
2010: Aparecimento do AngularJS, marcando o início da era dos frameworks modernos;
2013: React é lançado pelo Facebook, revolucionando o desenvolvimento de interfaces;
2015: ECMAScript 6 (ES6) introduz melhorias como Arrow Functions, Classes, Template Literals, e muito mais;
2016 em diante: Proliferação de frameworks e bibliotecas como Vue.js e Svelte, consolidando o JavaScript como linguagem indispensável;
Atualidade: O JavaScript é indispensável no desenvolvimento web, usado tanto no front-end quanto no back-end, e com crescente popularidade no desenvolvimento mobile e IoT.
OBS: JavaScript é a linguagem de programação que você usa para criar funcionalidades em sites. ECMAScript é o padrão que define como a linguagem funciona. Pense assim: JavaScript segue as “regras” definidas pelo ECMAScript. As versões do ECMAScript (como ES6) trazem novas funcionalidades que os navegadores implementam no JavaScript.

Curiosidades sobre JavaScript

Criado em 10 dias
- Brendan Eich desenvolveu o JavaScript super rápido, mas ele se tornou uma das linguagens mais importantes da web.
Já foi chamado de Mocha
- Antes de ser JavaScript, o nome da linguagem era Mocha, depois mudou para LiveScript.
É a linguagem mais usada
- JavaScript é a linguagem de programação mais utilizada no mundo, especialmente para criar sites interativos.
Funciona em qualquer navegador
- Você pode começar a aprender JavaScript agora mesmo no seu navegador, sem instalar nada!
Mudou a web com AJAX
- Com o AJAX, o JavaScript revolucionou a internet, permitindo carregar informações de forma dinâmica, sem precisar recarregar a página inteira. É por isso que aplicativos como Gmail e redes sociais são tão rápidos e interativos.
Não é só para sites
- Embora seja super popular no front-end, JavaScript também pode ser usado para criar jogos, aplicativos e até controlar hardware.
Tem pegadinhas divertidas
- Por exemplo: se você digitar [] + [] no console do navegador, o resultado será uma string vazia (""). Essas curiosidades ajudam a entender como a linguagem funciona.
Está em quase todos os sites
- Quase todos os sites modernos dependem de JavaScript para funcionar, então é uma habilidade indispensável para desenvolvedores web.
ECMA x JavaScript
- ECMAScript (ES) é a especificação que define as regras e padrões para linguagens de programação como o JavaScript e JavaScript (JS) é uma implementação dessa especificação, ou seja, é a linguagem real usada para programar na web, baseada nas diretrizes do ECMAScript.

Próximos passos…

Nas próximas aulas, vamos começar a programar. Mas, antes disso, é de extrema importância que você entenda como o computador funciona e compreenda a lógica de programação. A melhor maneira de aprender isso é assistindo aos vídeos do professor Abrantes no canal Computação Raiz. Ele foi meu professor e é um dos melhores que já tive.

Além disso, você vai perceber que a ciência da computação vai muito além de um código ou uma linguagem de programação. É sobre entender conceitos, resolver problemas e criar soluções inteligentes.

Segue o link do canal dele:

https://www.youtube.com/c/Computa%C3%A7%C3%A3oRaiz