Folha de Consulta JavaScript
Última atualização
Variáveis (let, const, var)
Declare valores; prefira const, depois let, e evite var.
| Operação | Sintaxe |
|---|---|
| Escopo de bloco, pode reatribuir | let count = 0; |
| Escopo de bloco, não pode reatribuir | const name = "Ada"; |
| Escopo de função (legado) | var x = 1; |
| Declarar sem valor | let result; |
| Várias declarações | let a = 1, b = 2; |
| Objeto constante (conteúdo mutável) | const user = {}; user.id = 1; |
Tipos de dados
Os tipos primitivos e de referência, além de como verificá-los.
| Tipo | Exemplo |
|---|---|
| Number | let n = 42; |
| String | let s = "hi"; |
| Boolean | let ok = true; |
| Array | let arr = [1, 2, 3]; |
| Object | let obj = { id: 1 }; |
| Null / undefined | let a = null;, let b; |
| Verificar um tipo | typeof n |
| Converter | Number("7"), String(42), Boolean(0) |
Strings e template literals
Construir e manipular texto.
| Operação | Sintaxe |
|---|---|
| Template literal | Hi ${name}, age ${age} (envolva em backticks) |
| Comprimento | text.length |
| Maiúsculas / minúsculas | text.toUpperCase(), text.toLowerCase() |
| Remover espaços em branco | text.trim() |
| Substituir tudo | text.replaceAll("a", "b") |
| Dividir em um array | text.split(",") |
| Inclui | text.includes("js") |
| Fatiar | text.slice(0, 3) |
Arrays e métodos de array
Coleções ordenadas e os métodos que as percorrem.
| Operação | Sintaxe |
|---|---|
| Adicionar / remover no final | arr.push(4), arr.pop() |
| Adicionar / remover no início | arr.unshift(0), arr.shift() |
| Transformar cada item | arr.map(x => x * 2) |
| Manter itens correspondentes | arr.filter(x => x > 0) |
| Reduzir a um único valor | arr.reduce((sum, x) => sum + x, 0) |
| Encontrar um item | arr.find(x => x.id === 1) |
| Testar some / every | arr.some(f), arr.every(f) |
| Índice de um valor | arr.indexOf(3), arr.includes(3) |
| Juntar em uma string | arr.join(", ") |
Objetos
Coleções de chave-valor.
| Operação | Sintaxe |
|---|---|
| Criar | const user = { id: 1, name: "Ada" }; |
| Acessar uma propriedade | user.name, user["name"] |
| Adicionar / atualizar uma propriedade | user.age = 25; |
| Excluir uma propriedade | delete user.age; |
| Obter todas as chaves / valores | Object.keys(user), Object.values(user) |
| Obter entradas | Object.entries(user) |
| Mesclar objetos | Object.assign({}, a, b) |
| Cópia rasa | const copy = { ...user }; |
Controle de fluxo
Condicionais e laços.
| Operação | Sintaxe |
|---|---|
| If / else if / else | if (x > 0) { … } else { … } |
| Ternário | const y = x > 0 ? 1 : 0; |
| Switch | switch (x) { case 1: … break; } |
| Laço for | for (let i = 0; i < 5; i++) { … } |
| For-of (valores) | for (const item of arr) { … } |
| For-in (chaves) | for (const key in obj) { … } |
| Laço while | while (x < 10) { … } |
Funções e arrow functions
Definir blocos reutilizáveis e chamáveis.
| Operação | Sintaxe |
|---|---|
| Declaração de função | function add(a, b) { return a + b; } |
| Arrow function | const add = (a, b) => a + b; |
| Arrow com um único argumento | const sq = x => x * x; |
| Arrow sem argumentos | const now = () => Date.now(); |
| Parâmetro padrão | function f(x = 0) { … } |
| Parâmetros rest | function f(...args) { … } |
| Invocada imediatamente (IIFE) | (() => { … })(); |
Desestruturação e spread
Desempacote valores e copie/mescle estruturas.
| Operação | Sintaxe |
|---|---|
| Desestruturação de array | const [a, b] = arr; |
| Desestruturação de objeto | const { id, name } = user; |
| Renomear ao desempacotar | const { id: userId } = user; |
| Valor padrão | const { age = 0 } = user; |
| Spread de um array | const all = [...a, ...b]; |
| Spread de um objeto | const next = { ...user, age: 25 }; |
| Rest na desestruturação | const [first, ...rest] = arr; |
Promises e async/await
Lide com trabalho assíncrono, como requisições de rede.
| Operação | Sintaxe |
|---|---|
| Função async | async function load() { … } |
| Await em uma promise | const data = await fetch(url); |
| Then / catch | promise.then(res => …).catch(err => …) |
| Try / catch com await | try { await f(); } catch (e) { … } |
| Resolve / reject | Promise.resolve(1), Promise.reject(err) |
| Aguardar todas | await Promise.all([a, b]) |
| Primeira a concluir | await Promise.race([a, b]) |
A sintaxe moderna de JavaScript que você mais usa, em uma única página. Esta folha de consulta JavaScript é uma referência rápida para o dia a dia com ES6+ - declarar variáveis, métodos de string e de array, objetos, arrow functions, desestruturação e async/await.
Tudo aqui é JavaScript padrão que roda em navegadores modernos e no Node.js. Copie o que precisar ou teste qualquer trecho ao vivo no playground de JS - sem nada para instalar.
Perguntas frequentes sobre a folha de consulta JavaScript
Esta folha de consulta JavaScript é gratuita?
Sim. Esta folha de consulta JavaScript é totalmente gratuita, sem necessidade de cadastro. Salve nos favoritos e volte sempre que precisar consultar uma sintaxe, um método de array ou um padrão assíncrono.
Qual é a diferença entre == e === em JavaScript?
== é a igualdade frouxa: converte os operandos para o mesmo tipo antes de comparar, então 0 == "0" é true. === é a igualdade estrita: compara tanto o valor quanto o tipo sem conversão, então 0 === "0" é false. Prefira === (e !==) em quase todos os casos - é previsível e evita coerções surpreendentes.Qual é a diferença entre let, const e var?
const e let têm escopo de bloco e foram adicionados no ES6; var tem escopo de função e é mais antigo. Use const para valores que você nunca reatribui, let para os que reatribui, e evite var para prevenir bugs de hoisting e escopo. Note que um objeto ou array const ainda pode ter seu conteúdo alterado - apenas a vinculação é constante.Posso praticar JavaScript online?
Sim. Abra o playground de JS para executar qualquer trecho desta folha de consulta no seu navegador - sem nada para instalar. Quando quiser estrutura, o curso interativo e gratuito de JavaScript da Coddy leva você passo a passo de variáveis e laços a métodos de array e async/await.
Esta folha de consulta é boa para iniciantes?
Sim. Ela está organizada do básico (variáveis, tipos de dados, strings) até desestruturação e async/await, de modo que você pode usar as seções de cima já no primeiro dia e ir avançando para os recursos modernos do ES6+.
Recursos relacionados
Mais folhas de consulta
