🚀 Como Usar o JavaScript Tutor
1. Navegação
Use a barra lateral esquerda para navegar entre os exercícios. Os exercícios estão organizados por categorias e dificuldade.
2. Editor de Código
Escreva seu código JavaScript no editor Monaco. O editor oferece:
- Syntax highlighting
- Auto-completar
- Detecção de erros
- Numeração de linhas
3. Terminal Interativo
Use o terminal para:
- Executar seu código
- Ver resultados do console.log()
- Testar comandos JavaScript
4. Validação
Clique em "Verificar" para validar sua solução. O sistema verificará se seu código produz a saída esperada.
⌨️ Atalhos de Teclado
Atalhos Principais
- Ctrl + Enter - Executar código
- F1 - Mostrar dica
- Ctrl + R - Resetar exercício
Atalhos do Editor
- Ctrl + / - Comentar/descomentar linha
- Ctrl + D - Selecionar próxima ocorrência
- Ctrl + F - Buscar no código
- Ctrl + Z - Desfazer
- Ctrl + Y - Refazer
Dicas de Produtividade
- Use Tab para auto-completar
- Ctrl + Espaço para sugestões
- Alt + ↑/↓ para mover linhas
📖 Conceitos JavaScript Básicos
Variáveis
let nome = "João";
const idade = 25;
var cidade = "São Paulo";
Tipos de Dados
- String: "texto"
- Number: 42, 3.14
- Boolean: true, false
- Array: [1, 2, 3]
- Object: {nome: "João"}
Funções
function saudacao(nome) {
return "Olá, " + nome + "!";
}
// Arrow function
const somar = (a, b) => a + b;
Estruturas de Controle
// If/else
if (idade >= 18) {
console.log("Maior de idade");
} else {
console.log("Menor de idade");
}
// Loop for
for (let i = 0; i < 5; i++) {
console.log(i);
}
🔧 Dicas e Truques
Debugging
- Use
console.log() para ver valores
- Verifique erros no terminal
- Teste pequenas partes do código
Boas Práticas
- Use nomes descritivos para variáveis
- Comente seu código quando necessário
- Mantenha funções pequenas e focadas
- Use const para valores que não mudam
Erros Comuns
- Esquecer ponto e vírgula
- Usar = ao invés de == ou ===
- Não fechar parênteses ou chaves
- Confundir let, const e var
Recursos Úteis
- Use as dicas quando estiver travado
- Leia os objetivos com atenção
- Teste diferentes abordagens
- Pratique regularmente
🎯 Métodos de Array Úteis
// Adicionar elementos
arr.push(item);
arr.unshift(item);
// Remover elementos
arr.pop();
arr.shift();
// Buscar
arr.indexOf(item);
arr.includes(item);
// Iterar
arr.forEach(item => console.log(item));
arr.map(item => item * 2);
arr.filter(item => item > 5);
🔤 Métodos de String Úteis
// Manipulação
str.toUpperCase();
str.toLowerCase();
str.trim();
// Busca
str.indexOf("texto");
str.includes("texto");
str.startsWith("início");
str.endsWith("fim");
// Divisão e junção
str.split(" ");
arr.join(" ");
🧮 Operadores Úteis
// Aritméticos
+ - * / % **
// Comparação
== === != !== < > <= >=
// Lógicos
&& || !
// Atribuição
= += -= *= /= %=
// Ternário
condição ? valorTrue : valorFalse;
📦 Trabalhando com Objetos
// Criar objeto
const pessoa = {
nome: "João",
idade: 30
};
// Acessar propriedades
pessoa.nome;
pessoa["idade"];
// Adicionar propriedades
pessoa.cidade = "SP";
// Listar chaves/valores
Object.keys(pessoa);
Object.values(pessoa);