JavaScript: Referência Rápida de JavaScript

Q: P: Onde posso encontrar a referência oficial de JavaScript?

R: A referência oficial está no MDN Web Docs — ela cobre todos os métodos, propriedades e casos extremos.

Q: P: Como mantenho esta referência atualizada?

R: Marque o MDN nos favoritos. JavaScript evolui a cada ano; esta página cobre recursos do ES2020+. Novos métodos como Array.toSorted() (ES2023) podem ainda não aparecer aqui.

Q: P: Por que == não é recomendado?

R: == realiza coerção implícita de tipo (ex.: 0 == "0" é true). Use === para igualdade estrita para evitar surpresas.

Esta página é um cheat sheet de referência rápida para sintaxe e APIs comuns do JavaScript, organizado por categoria.

1. Referência de Comandos

Comando	Sintaxe	Descrição
`var`	`var nome = valor;`	Declaração de variável com escopo de função (obsoleto — use `let`)
`let`	`let nome = valor;`	Declaração de variável com escopo de bloco, reatribuível
`const`	`const nome = valor;`	Declaração de constante com escopo de bloco, não reatribuível
`if/else`	`if (cond) {} else if (cond) {} else {}`	Ramificação condicional
`for`	`for (let i = 0; i < n; i++) {}`	Loop clássico
`while`	`while (cond) {}`	Loop com condição no início
`do...while`	`do {} while (cond);`	Loop com corpo primeiro (executa pelo menos uma vez)
`switch`	`switch (expr) { case val: break; default: }`	Correspondência multi-ramo
`try/catch`	`try {} catch (err) {} finally {}`	Tratamento de exceções
`function`	`function nome(params) {}`	Declaração de função
`return`	`return valor;`	Retorna um valor de uma função
`class`	`class Nome { constructor() {} }`	Declaração de classe
`import`	`import { nome } from 'modulo';`	Importar um módulo
`export`	`export const nome = valor;`	Exportar de um módulo

▶ Exemplo

JAVASCRIPT

// Exemplo de código desta seção
const message = "Olá, Mundo!";
console.log(message);

▶ Experimente

Este é o exemplo mais simples; as seções seguintes explicarão em detalhes.## 2. Referência de Operadores

Categoria	Operadores	Descrição
Aritmética	`+ - * / % **`	Somar, subtrair, multiplicar, dividir, resto, exponenciação
Aritmética	`++ --`	Incrementar, decrementar
Comparação	`== != === !==`	Igual, diferente, estritamente igual, estritamente diferente
Comparação	`> < >= <=`	Maior que, menor que, maior ou igual, menor ou igual
Lógico	`&& \|\| !`	E, OU, NÃO
Atribuição	`= += -= *= /= %=`	Atribuição e atribuição composta
Ternário	`cond ? a : b`	Expressão condicional
Spread	`...arr`	Espalhar array ou objeto

3. Cheat Sheet de Métodos de String

Método	Sintaxe	Descrição
`length`	`str.length`	Comprimento da string (propriedade, não método)
`charAt`	`str.charAt(indice)`	Caractere na posição dada
`indexOf`	`str.indexOf(busca, de?)`	Encontrar posição de substring; retorna -1 se não encontrar
`includes`	`str.includes(busca, de?)`	Verificar se substring existe; retorna booleano
`slice`	`str.slice(inicio, fim?)`	Extrair substring (suporta índices negativos)
`substring`	`str.substring(inicio, fim?)`	Extrair substring (sem índices negativos)
`replace`	`str.replace(padrao, substituicao)`	Substituir primeira correspondência
`toUpperCase`	`str.toUpperCase()`	Converter para maiúsculas
`toLowerCase`	`str.toLowerCase()`	Converter para minúsculas
`trim`	`str.trim()`	Remover espaços em branco do início e fim
`split`	`str.split(separador, limite?)`	Dividir string em array por separador
`padStart`	`str.padStart(comprimento, preenchimento)`	Preencher início até comprimento dado
`padEnd`	`str.padEnd(comprimento, preenchimento)`	Preencher fim até comprimento dado
`repeat`	`str.repeat(vezes)`	Repetir a string
`match`	`str.match(regex)`	Correspondência regex; retorna array ou null

4. Cheat Sheet de Métodos de Array

Método	Sintaxe	Descrição
`push`	`arr.push(item)`	Adicionar ao final; retorna novo comprimento
`pop`	`arr.pop()`	Remover do final; retorna item removido
`shift`	`arr.shift()`	Remover do início; retorna item removido
`unshift`	`arr.unshift(item)`	Adicionar ao início; retorna novo comprimento
`splice`	`arr.splice(inicio, qtdExclusao, ...itens)`	Adicionar/remover/substituir (muta o array)
`slice`	`arr.slice(inicio, fim?)`	Extrair sub-array (não muta)
`map`	`arr.map(fn)`	Transformar cada elemento; retorna novo array
`filter`	`arr.filter(fn)`	Manter elementos que passam no teste; retorna novo array
`reduce`	`arr.reduce(fn, init)`	Acumular um único resultado do array
`find`	`arr.find(fn)`	Retornar o primeiro elemento que passa no teste
`findIndex`	`arr.findIndex(fn)`	Retornar o índice do primeiro elemento correspondente
`sort`	`arr.sort(fnComparacao?)`	Ordenar o array (muta)
`reverse`	`arr.reverse()`	Inverter o array (muta)
`forEach`	`arr.forEach(fn)`	Iterar sobre cada elemento; sem valor de retorno
`every`	`arr.every(fn)`	Verificar se todos os elementos passam no teste
`some`	`arr.some(fn)`	Verificar se pelo menos um elemento passa no teste
`includes`	`arr.includes(item, de?)`	Verificar se o array contém um elemento
`indexOf`	`arr.indexOf(item, de?)`	Encontrar o índice de um elemento
`join`	`arr.join(separador?)`	Juntar array em uma string
`concat`	`arr.concat(arr2)`	Mesclar arrays (não muta)
`flat`	`arr.flat(profundidade?)`	Achatar arrays aninhados

5. Cheat Sheet de Métodos Math

Método	Sintaxe	Descrição
`round`	`Math.round(x)`	Arredondar para o inteiro mais próximo
`floor`	`Math.floor(x)`	Arredondar para baixo
`ceil`	`Math.ceil(x)`	Arredondar para cima
`random`	`Math.random()`	Número aleatório em [0, 1)
`max`	`Math.max(a, b, ...)`	Retornar o maior valor
`min`	`Math.min(a, b, ...)`	Retornar o menor valor
`abs`	`Math.abs(x)`	Valor absoluto
`pow`	`Math.pow(base, exp)`	Exponenciação
`sqrt`	`Math.sqrt(x)`	Raiz quadrada
`PI`	`Math.PI`	Pi ≈ 3.14159
`E`	`Math.E`	Número de Euler ≈ 2.71828
`trunc`	`Math.trunc(x)`	Remover a parte fracionária
`sign`	`Math.sign(x)`	Retorna 1 / 0 / -1

6. Cheat Sheet de Métodos DOM

Método/Propriedade	Sintaxe	Descrição
`getElementById`	`document.getElementById('id')`	Obter elemento único por ID
`querySelector`	`document.querySelector('seletor')`	Obter primeiro elemento que combina com seletor CSS
`querySelectorAll`	`document.querySelectorAll('seletor')`	Obter todos elementos que combinam com seletor CSS
`getElementsByClassName`	`document.getElementsByClassName('cls')`	Obter elementos por nome de classe (coleção ao vivo)
`getElementsByTagName`	`document.getElementsByTagName('tag')`	Obter elementos por nome de tag (coleção ao vivo)
`textContent`	`el.textContent`	Ler ou escrever conteúdo de texto puro
`innerHTML`	`el.innerHTML`	Ler ou escrever conteúdo HTML (cuidado com XSS)
`setAttribute`	`el.setAttribute('nome', 'valor')`	Definir um atributo
`getAttribute`	`el.getAttribute('nome')`	Obter valor de um atributo
`classList`	`el.classList.add/remove/toggle/contains`	Manipular classes CSS
`createElement`	`document.createElement('tag')`	Criar novo nó de elemento
`appendChild`	`pai.appendChild(filho)`	Anexar nó filho ao final
`removeChild`	`pai.removeChild(filho)`	Remover nó filho
`cloneNode`	`el.cloneNode(profundidade?)`	Clonar nó (true = clone profundo)

7. Referência de Eventos

Evento	Quando Dispara	Elementos Comuns
`click`	Clique único	Qualquer elemento
`dblclick`	Clique duplo	Qualquer elemento
`mouseover`	Mouse entra	Qualquer elemento
`mouseout`	Mouse sai	Qualquer elemento
`keydown`	Tecla pressionada	document, elementos de formulário
`keyup`	Tecla solta	document, elementos de formulário
`submit`	Formulário enviado	form
`change`	Valor mudou e perdeu foco	input, select, textarea
`input`	Valor mudou em tempo real	input, textarea
`load`	Página e recursos totalmente carregados	window
`DOMContentLoaded`	Parsing do HTML completo	document
`focus`	Elemento ganha foco	Elementos de formulário
`blur`	Elemento perde foco	Elementos de formulário
`scroll`	Rolagem	window, elementos roláveis
`resize`	Tamanho da janela muda	window

❓ Perguntas Frequentes

P: Onde posso encontrar a referência oficial de JavaScript? R: A referência oficial está no MDN Web Docs — ela cobre todos os métodos, propriedades e casos extremos.

P: Como mantenho esta referência atualizada? R: Marque o MDN nos favoritos. JavaScript evolui a cada ano; esta página cobre recursos do ES2020+. Novos métodos como Array.toSorted() (ES2023) podem ainda não aparecer aqui.

P: Por que == não é recomendado? R: == realiza coerção implícita de tipo (ex.: 0 == "0" é true). Use === para igualdade estrita para evitar surpresas.

📖 Resumo

Esta referência cobre declarações, operadores e métodos principais de JavaScript
MDN é a fonte autoritativa para casos extremos e novos recursos
Prefira === em vez de == para evitar bugs de coerção de tipo
Métodos de array e string são estáveis, mas novos aparecem anualmente

📝 Exercícios

Escolha 3 métodos que você não reconhece. Leia suas documentações no MDN. Escreva um resumo de uma linha para cada.
Encontre um lugar no seu código que usa == e refatore para ===. Execute os testes.
Liste 5 métodos de array que recebem uma função callback. Descreva a assinatura do callback.

Equipe Técnica Web-Tutorial

Uma plataforma de tutoriais mantida por diversos desenvolvedores. Cada tutorial é escrito e revisado por profissionais da área correspondente. Trabalhamos para manter nosso conteúdo preciso e confiável — se encontrar algum problema, avise-nos.

Sobre Nós