Carregando...

Métodos de string

Você já sabe escrever uma string. Esta sessão é sobre métodos: ferramentas chamadas no texto para mudar maiúsculas, cortar um pedaço, limpar espaços, trocar palavras ou perguntar «essa frase aparece dentro?». Não memorize todos os métodos da linguagem — comece com um conjunto curto do dia a dia.

Como funcionam os métodos de string em JavaScript?

Um método de string chama-se com ponto, nome e parênteses: "hi".toUpperCase(). A maioria devolve uma string nova. O original só muda se você guardar o resultado (let clean = raw.trim()). Para começar: toUpperCase / toLowerCase, slice, trim, replace (primeira ocorrência), includes (sim/não) e indexOf (posição ou -1).

Caixa de ferramentas de métodos

📊 Métodos de texto que o iniciante usa primeiro

Ideia Exemplo Resultado / nota
Maiúsculas "hi".toUpperCase() "HI"
slice "JavaScript".slice(0, 4) "Java" (índice final não entra)
trim " hi ".trim() "hi"
replace "a-a".replace("-", "/") "a/a" (só a primeira ocorrência)
includes "hello".includes("ell") true
indexOf "hello".indexOf("l") 2 (primeiro índice; se faltar = -1)

Mudar maiúsculas e minúsculas

toUpperCase() e toLowerCase() criam uma string nova com letras uniformes — útil antes de comparar o que o usuário digitou.

Maiúsculas e minúsculas

javascript 
let city = "Tehran";
console.log(city.toUpperCase());
console.log(city.toLowerCase());
console.log(city);

Cortar um pedaço com slice

slice(start, end) copia de start até antes de end. Sem end, vai até o último caractere. Índices começam em 0.

Cortar string com slice

javascript 
let word = "JavaScript";
console.log(word.slice(0, 4));
console.log(word.slice(4));
console.log(word);

Limpar espaços das bordas com trim

A entrada do usuário costuma ter espaços no início ou no fim. trim() remove esses; os do meio ficam.

Limpar espaços com trim

javascript 
let raw = "  hello  ";
let clean = raw.trim();
console.log(raw.length);
console.log(clean.length);
console.log(clean);

Trocar texto com replace

replace(old, new) troca a primeira ocorrência de old por new. O resto permanece. (Trocar todas as ocorrências vem depois.)

Substituir a primeira ocorrência

javascript 
let line = "red-blue-red";
console.log(line.replace("-", "/"));
console.log(line);

Buscar com includes e indexOf

includes(piece) responde sim/não (true / false). indexOf(piece) devolve o índice da primeira ocorrência, ou -1 se não achar.

includes e indexOf

javascript 
let msg = "Welcome guest";
console.log(msg.includes("guest"));
console.log(msg.includes("admin"));
console.log(msg.indexOf("come"));
console.log(msg.indexOf("x"));

Título limpo na página

Faça trim, unifique maiúsculas e mostre com textContent.

A página mostra um título limpo

html 
<!DOCTYPE html>
<html>
<head>
<title>String methods — clean title</title>
</head>
<body>
<p id="out">…</p>
<script>
let raw = "  javaScript methods  ";
let title = raw.trim().toUpperCase();
document.getElementById("out").textContent = title;
</script>
</body>
</html>

O parágrafo mostra o título limpo. Mude só raw, atualize e confirme trim + maiúsculas.

Experimente você

  1. Registre "Tehran".toUpperCase() e "Tehran".toLowerCase(); se guardar numa variável, veja também o original.
  2. De "JavaScript", slice os quatro primeiros caracteres e depois do índice 4 até o fim.
  3. Faça trim de " hi " e compare .length antes e depois.
  4. Em "a-b-c", troque o primeiro "-" por "/"; registre resultado e original.
  5. Numa frase curta, teste includes de uma palavra presente e outra ausente; registre indexOf de uma letra.
  6. No demo HTML, mude só raw, atualize e leia o novo título.

Erros comuns

  • Escrever toUpperCase sem () — a chamada precisa de parênteses: .toUpperCase()
  • Esperar que "hi".toUpperCase() altere o original — devolve um novo; atribua se precisar
  • Achar que slice(0, 4) inclui o índice 4 — o fim fica de fora
  • Supor que replace muda todas as ocorrências — o padrão é só a primeira
  • Usar só indexOf quando quer sim/não claro — includes lê melhor

Resumo

  • Chame métodos com . + nome + ()
  • toUpperCase / toLowerCase mudam a caixa; slice corta; trim limpa as bordas
  • replace troca a primeira ocorrência; includes / indexOf buscam dentro
  • Costumam devolver um valor novo — guarde-o se quiser mantê-lo
  • Em seguida: booleanos — true e false para decisões sim/não

🧠 Teste Seu Conhecimento

Pronto para Começar

Teste Seu Conhecimento

Desafie-se com este questionário interativo e veja o quão bem você entende o tópico

❓
8
Perguntas
🎯
70%
Para Passar
♾️
∞
Tempo
🔄
∞
Tentativas

📝 Instruções

  • Leia cada pergunta cuidadosamente
  • Selecione a melhor resposta para cada pergunta
  • Você pode refazer o quiz quantas vezes quiser
  • Seu progresso será mostrado no topo
Tópico 11 de 15
Javascript Tutorial