Acredita que String é só texto? Então você precisa ler isso
Você provavelmente usa strings todos os dias no JavaScript, mas será que realmente entende como elas funcionam por baixo dos panos?
Neste breve artigo eu compartilho o que aprendi sobre elas e que faz toda a diferença na minha prática.
- O que são strings
- Características das strings: imutabilidade, length e índice
- Características das strings: empty vs null vs undefined
- Métodos de strings
O que são strings
Strings são um tipo fundamental, também chamado de tipo primitivo. Elas são estruturas formadas por uma sequência de caracteres usadas para representar texto. Podem conter zero ou mais caracteres do alfabeto (a, b, ..., Z), números (1, -1, 0) ou símbolos especiais (@, #, _), graças à codificação UTF-16.
Em outras palavras, pense nas strings como letras (caracteres) que, quando colocadas em sequência, formam palavras, frases e textos maiores.
Strings podem ser atribuídas a qualquer tipo de variável (let, var ou const). Para criar uma string, você pode usar:
Aspas simples (' ')
let singleChar = 'a';
let doubleChar = 'ab';
var singleWord = 'phone';
const multiWord = 'call me when you arrive';
let specialSym = '😊 世界!';
Aspas duplas (" ")
let singleChar = "a";
let doubleChar = "ab";
var singleWord = "phone";
const multiWord = "call me when you arrive";
let specialSym = "😊 世界!";
Template literals (` `)
let singleChar = `a`;
let doubleChar = `ab`;
var singleWord = `phone`;
const multiWord = `call me when you arrive`;
let specialSym = `😊 世界!`;
As crases são muito usadas porque permitem expressões embutidas e strings multilinhas:
let firstName = `Luiz`;
let secondName = `Gustavo`;
// Expressões embutidas
let fullName = `${firstName} ${secondName}`; // 'Luiz Gustavo'
let sum = `${5 + 5}`; // '10'
// String multilinha
let multiline = `
Primeira linha
Segunda linha
${firstName} ${secondName}
`;
Características das strings: Imutabilidade
Uma vez criada, a string é imutável. Isso significa que o valor original não pode ser alterado. Mas como assim? Eu altero strings o tempo todo!
let myName = "Luiz";
console.log(myName); // 'Luiz'
myName += " Gustavo";
console.log(myName); // 'Luiz Gustavo'
myName = "Gustavo";
console.log(myName); // 'Gustavo'
O que realmente acontece é que, toda vez que você “altera” uma string, o JavaScript cria uma nova string na memória. A variável passa a apontar para esse novo valor em memória, enquanto a original continua existindo em outro (até ser removida pelo garbage collector). Mesmo quando você volta o valor para o original, uma nova string é criada.
Características das strings: length
Toda string possui a propriedade .length, que informa quantos caracteres ela tem.
let myName = "Luiz";
console.log(myName.length); // 4
myName += " Gustavo";
console.log(myName.length); // 12
Importante: espaços em branco também contam como caracteres.
let emoji = "😊";
console.log(emoji.length); // 2 (por causa do surrogate pair do UTF-16)
Características das strings: Índice
String é uma sequência ordenada de caracteres, isso de lembra alguma outra coisa? Sim, arrays!
Semelhante a arrays, podemos acessar cada item da sequência através de colchetes.[indice], e que também começa em 0.
let myName = "Luiz";
console.log(myName[0]); // 'L'
console.log(myName[1]); // 'u'
console.log(myName[2]); // 'i'
console.log(myName[3]); // 'z'
Você também pode usar uma variável como índice:
let indexNum = 0;
console.log(myName[indexNum]); // 'L'
Índices inválidos retornam undefined:
console.log(myName[4]); // undefined
console.log(myName[-1]); // undefined
console.log(myName['u']); // undefined
Empty vs null vs undefined
Empty (string vazia)
É uma variável que existe, tem tipo string, mas não possui nenhum caractere.
let myName = "";
console.log(myName.length); // 0
console.log(typeof myName); // 'string'
Null
Representa a ausência intencional de valor. Não é uma string.
let secondName = null;
console.log(typeof secondName); // 'object' (quirk histórico do JS)
console.log(secondName.length); // TypeError
Undefined
A variável foi declarada, mas não recebeu nenhum valor.
let myName;
console.log(myName); // undefined
console.log(typeof myName); // 'undefined'
Resumo: string vazia (""), null e undefined são coisas diferentes tanto em tipo quanto em comportamento.
Métodos de strings
Strings possuem diversos métodos úteis. Vamos ver os principais.
.charAt(index)
Retorna o caractere na posição informada.
let myName = "luiz";
console.log(myName.charAt(0)); // 'l'
console.log(myName.charAt(3)); // 'z'
Diferença importante em relação ao acesso por índice []:
- charAt(5) em string de 4 caracteres → retorna '' (string vazia)
- minhaString[5] → retorna undefined
Isso é útil quando você precisa garantir que o resultado seja sempre uma string.
.slice(start, end)
"Fatia"/copia uma parte da string original e retorna uma nova string (não modifica a original).
- start: obrigatório e inclusivo
- end: opcional e exclusivo (não inclui o caractere dessa posição)
let seq = "123456789";
console.log(seq.slice(0, 3)); // '123'
console.log(seq.slice(6)); // '789'
console.log(seq.slice(-1)); // '9'
console.log(seq.slice(0, -1)); // '12345678'
Regras importantes:
- Se start > end, retorna string vazia.
- Aceita números negativos (conta a partir do final).
.substring(start, end)
Muito parecido com slice, mas com comportamento diferente em números negativos.
- Números negativos são convertidos para 0.
- Se start > end, o método inverte os valores automaticamente.
let seq = "123456789";
console.log(seq.substring(6, 3)); // '456' (inverte)
console.log(seq.substring(-1, 4)); // '1234'
console.log(seq.substring(3, -2)); // '123'
.replace(searchValue, newValue)
Substitui a primeira ocorrência de um valor por outro.
let name = "luiz messias";
console.log(name.replace('messias', 'Gustavo')); // 'luiz Gustavo'
let text = "luiz luiz messias";
console.log(text.replace('luiz', 'Gustavo')); // 'Gustavo luiz messias'
Se o valor não for encontrado, retorna a string original.
Métodos bônus
toUpperCase() e toLowerCase()
let text = "Hello World";
console.log(text.toUpperCase()); // "HELLO WORLD"
console.log(text.toLowerCase()); // "hello world"
concat()
let saudacao = "Olá";
console.log(saudacao.concat(" ", "mundo!")); // "Olá mundo!"
trim()
let texto = " Olá mundo ";
console.log(texto.trim()); // "Olá mundo"
padStart() e padEnd()
let num = "5";
console.log(num.padStart(4, "0")); // "0005"
console.log(num.padEnd(4, "0")); // "5000"
