Pular para o conteúdo principal

Resumo de Javascript (Parcial)

Por Mateus Biancardi e Eduardo Ferraz

Atualizado em: 19/02/2024

🤔 Por que fazer?​

O objetivo desse manual é apresentar um resuminho das principais funcionalidades do Javascript, e ele é destinado para quem caiu de paraquedas em React e não entende muito bem como a linguagem funciona (mesmo sabendo outra linguagem de programação) e para quem simplesmente esqueceu alguma funcionalidade e deseja refrescar a memória. 😀

💡 O que precisamos para aprender Javascript?​

  • Ideal que tenha conhecimento prévio em programação
  • Saber ler!

⚙️ Programando em JS no VSCode​

Antes de tudo, saiba que o VSCode já possui suporte ao Javascript de fábrica. Entretanto, é preciso de algum lugar para a execução dos códigos que você criar (se considerar que você está executando um arquivo JS separado do HTML). Para sua felicidade, o VSCode possui a incrível funcionalidade das extensões. Basta instalar a extensão Code Runner e clicar na setinha de play no canto superior direito e voilá! Se você está apenas pesquisando funcionalidades, pode desconsiderar o que foi dito anteriormente.

Primeiros passos​

Você já deve ter ouvido falar na lenda que se um programador não imprime "Hello World!" ela não aprende programação. Saiba que esse boato é a mais absoluta verdade. Para imprimir no terminal, basta usar a função console.log():

console.log('Hello World!');

Como boa prática de programação, é importante que seja colocado o ponto e vírgula ';' no final da linha de código.

Variáveis​

A principal maneira de declarar uma variável é usando let e const. Obs: não é recomendado o uso de var:

let animal = 'Cachorro';
const comida = 'Pizza';

É possível declarar mais de uma variável por linha:

let genero = 'masculino', cores = 'laranja e preto';
const idade = 14, aniversario = '23/01/2003';

Quando as variáveis possuem mais de uma palavra, é recomendado o uso de camelCase:

let nomeSobrenome = 'José Bezerra';

Tipagem​

Em Javascript, não é necessário declarar o tipo da linguagem como em C. Porém, ao trabalhar com aplicações em React, é muito provável que você se depare com o Typescript. Typescript nada mais é que o Javascript com tipagem, e sua principal vantagem é evitar futuras dores de cabeça com relação a tipagem. Em Javascript, temos alguns tipos que são atribuídos automaticamente pelo compilador. São eles:

  • number: qualquer tipo de número.
  • bigint: números inteiros que excedem o limite de números de number.
  • string: vetor de caracteres (numeros podem ser declarados como string, o que impossibilita qualquer operação com eles. É necessário converter para numero).
  • boolean: true e false.
  • null: valores desconhecidos.
  • undefined: valores indefinidos.
  • object: estrutura de dados.

Typeof​

Essa função retorna o tipo da variável.

let animal = 'cachorro';
const idade = 4;
let objeto = {
  utensilios: 'garfo';
}

console.log(typeof(animal)); // retorna string
console.log(typeof(idade)); // retorna number
console.log(typeof(objeto)); // retorna object
console.log(typeof(objeto.utensilios)); // retorna string

Você deve ter se perguntado: o que são e qual a diferença entre Null e Undefined? O typeof pode nos ajudar a responder!

let x;
console.log(x) // retorna undefined;
x = null;
console.log(x) // retorna null;

Analisando o bloco de código apresentado, conclui-se que o tipo undefined é para quando uma variável está declarada, mas sem nenhum valor atribuído. Já o null é simplesmente uma variável que foi atribuída o "vazio" nela.

Operadores​

Existem alguns operadores básicos em Javascript. São eles:

  • Adição (+);
  • Subtração (-);
  • Multiplicação (*);
  • Divisão (/);
  • Resto (Sempre retorna o resto da divisão) (//);
  • Potencia (**);
let number1 = 2, number2 = 3;
console.log (number1 + number2); //5
console.log (number1 * number2); //6
console.log (number1 / number2); //0.6666...

Em Javascript, o '+' também significa concatenação de strings:

let string1 = 'Nome', string2 = 'Sobrenome';
console.log (string1 + string2); //NomeSobrenome

Observe que não há nenhum espaço entre string1 e string2. Para resolver isso, basta concatenar uma string (' ');

console.log(string1 + ' ' + string2);/Nome Sobrenome

Atribuições​

Pode-se atribuir o resultado de uma expressão para uma varíavel.

let a = 1, b = 2;
let c = a + b;
console.log(c); //3

Também é possível usar atribuições compostas, como +=, -=, *=, /=, ++, --

let d = 5;
d += 2;
console.log(d); //7

let e = 1;
console.log(++e); //2

Perceba que há uma diferença entre utilizar e++ e utilizar ++e, isso define se a soma será feita antes ou depois da função chamada, nesse caso, console.log()

🤝 Dicas úteis: (ou Observações)​

Para a criação desse manual, antes foram feitos vários códigos de exemplo para mostrar funcionamentos especiais do JS e alguns fundamentos importantes. Todos esses códigos estão presentes no repositório Tutorial JS Inicialte

Nesse repositório, há exemplos de códigos mais complexos ainda não elaborados neste documento.