Métodos de manipulação de strings
Seja bem-vindo ao módulo 5! Nesta jornada, você dominará a arte de manipular strings em JavaScript, explorando métodos poderosos para transformar, extrair e combinar partes de strings.
Prepare-se para aprimorar suas habilidades e criar programas mais dinâmicos e interativos.
Acesso a caracteres individuais
Acesso a caracteres individuais de uma string
Para entender o acesso a caracteres individuais em uma string, imagine uma sequência de caixas, onde cada caixa contém uma letra.
Cada caixa é numerada em ordem crescente, começando do número 0. Essa sequência de caixas representa a string.
Quando queremos acessar um caractere específico dessa string, podemos nos referir à caixa correspondente usando o número atribuído a ela.
Por exemplo, se queremos acessar o terceiro caractere da string, nos referimos à caixa número 2.
Exemplo prático:
// Definindo a string
var minhaString = "JavaScript";
// Acessando o caractere "a" na string
var caractereA = minhaString[1];
// Exibindo o resultado
console.log("O caractere 'a' está na caixa 1: " + caractereA);
Neste exemplo, a variável caractereA armazenará o valor a da string JavaScript usando a notação de colchetes. A mensagem exibida no console indicará que o caractere a está na caixa 1. Vale lembrar que a contagem começa do 0, por isso usamos [1] para acessar a segunda caixa, onde está o a.
Importância do acesso a caracteres individuais:
O acesso a caracteres individuais de uma string é útil quando precisamos manipular ou examinar partes específicas da string.
Por exemplo, podemos verificar se um caractere é uma vogal, substituir um caractere por outro ou fazer operações de comparação entre caracteres.
Essa habilidade é fundamental para realizar diversas tarefas com strings, pois nos permite trabalhar com caracteres individualmente, modificá-los ou obter informações específicas deles.
Lembre-se de que é importante utilizar a notação de colchetes [] para acessar os caracteres e que a contagem dos índices começa em 0, ou seja, o primeiro caractere é o de índice 0, o segundo é o de índice 1 e assim por diante.
Outro exemplo
Agora, se quisermos acessar o caractere “o” da string, podemos utilizar a notação de colchetes [] para acessar o caractere pelo seu índice. Lembre-se de que a contagem dos índices começa em 0.
const string = "Hello, World!"; const caractere = string[4]; console.log(caractere); // Resultado: o
No exemplo acima, atribuímos a string “Hello, World!” à variável string. Em seguida, utilizamos a notação de colchetes [] para acessar o quinto caractere da string, que tem índice 4.
O valor desse caractere é atribuído à variável caractere. Por fim, imprimimos o valor de caractere no console, que será “o”.
Dessa forma, conseguimos acessar um caractere específico da string utilizando a notação de colchetes e o índice correspondente.
Comprimento da string
O comprimento de uma string é a quantidade de caracteres que ela contém. Para obter o comprimento de uma string, podemos usar o método length.
Esse método retorna um valor numérico representando o número de caracteres da string.
Podemos fazer uma analogia com uma régua para entender melhor. Imagine que cada caractere da string é como uma marcação na régua.
Ao utilizar o método length, estamos contando o número de marcações na régua, ou seja, o número de caracteres na string.
Vejamos um exemplo:
const string = "Hello, World!"; const comprimento = string.length; console.log(comprimento); // Resultado: 13
No exemplo acima, atribuímos a string “Hello, World!” à variável string. Em seguida, utilizamos o método length para obter o comprimento da string e armazenamos o valor retornado na variável comprimento.
Por fim, imprimimos o valor de comprimento no console, que será 13, correspondendo ao número de caracteres na string.
Assim, podemos utilizar o método length para determinar o comprimento de uma string em JavaScript, contando quantos caracteres ela possui.
Concatenação de strings
A concatenação de strings é o processo de unir duas ou mais strings para formar uma única string. Em JavaScript, podemos realizar essa operação utilizando o operador de adição (+) ou o método concat().
Podemos fazer uma analogia com um quebra-cabeça para entender melhor. Imagine que cada string é como uma peça de um quebra-cabeça.
Ao realizar a concatenação, estamos juntando essas peças para formar uma única imagem.
Vejamos alguns exemplos:
const string1 = "Hello"; const string2 = "World"; const string3 = string1 + " " + string2; console.log(string3); // Resultado: "Hello World"
No exemplo acima, temos as strings Hello e World. Utilizando o operador de adição (+), podemos unir as duas strings e adicionar um espaço entre elas.
O resultado é uma nova string “Hello World”, que é armazenada na variável string3 e impressa no console.
Também podemos realizar a concatenação utilizando o método concat():
const string1 = "Hello";
const string2 = "World";
const string3 = string1.concat(" ", string2);
console.log(string3); // Resultado: "Hello World"
Nesse exemplo, utilizamos o método concat() na variável string1, passando como argumento a string ” ” (espaço) e a variável string2.
O método concatena essas strings e retorna a nova string Hello World, que é armazenada na variável string3 e impressa no console.
Assim, a concatenação de strings nos permite unir diferentes partes de texto para formar uma única string em JavaScript, como peças de um quebra-cabeça se encaixando.
Transformação de caixa
A transformação de caixa refere-se à alteração do formato ou do estilo de escrita de uma string. Em JavaScript, temos três métodos principais para realizar essas transformações: toUpperCase(), toLowerCase() e charAt().
Vamos fazer uma analogia com um guarda-roupa para entender melhor. Imagine que as strings são como roupas guardadas no guarda-roupa.
Cada método de transformação é como um tipo de arrumação que podemos aplicar às roupas, seja dobrando-as, colocando-as em cabides ou separando-as por cores.
O método toUpperCase() transforma todos os caracteres da string em letras maiúsculas. Por exemplo:
const string = "hello world"; const upperCaseString = string.toUpperCase(); console.log(upperCaseString); // Resultado: "HELLO WORLD"
Por outro lado, o método toLowerCase() transforma todos os caracteres da string em letras minúsculas. Vejamos um exemplo:
const string = "HELLO WORLD"; const lowerCaseString = string.toLowerCase(); console.log(lowerCaseString); // Resultado: "hello world"
Por último, temos o método charAt(), que nos permite obter o caractere em uma posição específica da string.
Ele recebe como argumento a posição do caractere desejado, começando a contagem a partir do índice 0. Por exemplo:
const string = "hello"; const character = string.charAt(1); console.log(character); // Resultado: "e"
Assim, podemos realizar diferentes transformações de caixa em strings em JavaScript, como arrumar roupas no guarda-roupa de acordo com nosso gosto e necessidades.
Substituição de substrings
A substituição de substrings refere-se à troca de uma parte específica de uma string por outra. Em JavaScript, utilizamos o método replace() para realizar essa substituição.
Vamos utilizar uma analogia para entender melhor. Imagine que a string seja como uma frase escrita em um papel.
A substituição de substrings é como a ação de usar uma caneta para apagar uma palavra indesejada na frase e escrever uma nova palavra em seu lugar.
O método replace() recebe dois argumentos: o primeiro é a substring que desejamos substituir e o segundo é a nova substring que será colocada no lugar da antiga. Por exemplo:
const string = "Eu gosto de maçãs.";
const novaString = string.replace("maçãs", "laranjas");
console.log(novaString); // Resultado: "Eu gosto de laranjas."
É importante destacar que o método replace() substitui apenas a primeira ocorrência da substring. Se quisermos substituir todas as ocorrências, podemos usar uma expressão regular com a flag global /g. Veja um exemplo:
const string = "A laranja é uma fruta muito saborosa. Eu adoro laranja."; const novaString = string.replace(/laranja/g, "maçã"); console.log(novaString); // Resultado: "A maçã é uma fruta muito saborosa. Eu adoro maçã."
Neste caso, utilizamos a expressão regular /laranja/g como o primeiro argumento do método replace().
A flag g indica que queremos substituir todas as ocorrências da palavra “laranja” por “maçã“.
Dessa forma, podemos utilizar o método replace() para substituir substrings em uma string, assim como apagar uma palavra em um papel e escrever uma nova palavra no lugar.
Divisão da string
A divisão da string é o processo de quebrar uma string em várias partes menores, com base em um separador específico.
Em JavaScript, utilizamos o método split() para realizar essa divisão.
O método split() recebe como argumento o separador que será utilizado para dividir a string.
Esse separador pode ser um caractere específico, como um espaço em branco, uma vírgula, ou até mesmo uma expressão regular.
Vejamos um exemplo para ilustrar melhor:
const frase = "Olá, como vai você?";
const palavras = frase.split(" ");
console.log(palavras); // Resultado: ["Olá,", "como", "vai", "você?"]
Podemos utilizar outros separadores, como uma vírgula, por exemplo:
const numeros = "1,2,3,4,5";
const arrayNumeros = numeros.split(",");
console.log(arrayNumeros); // Resultado: ["1", "2", "3", "4", "5"]
Neste caso, utilizamos o método split(“,”) para dividir a string de números em um array, utilizando a vírgula como separador.
Dessa forma, o método split() nos permite dividir uma string em partes menores com base em um separador específico.
Busca em uma string
A busca em uma string é o processo de encontrar a posição de uma determinada sequência de caracteres dentro de uma string maior. Em JavaScript, utilizamos o método indexOf() para realizar essa busca.
Vamos utilizar uma analogia para facilitar o entendimento. Imagine que a string seja como uma frase escrita em um livro.
A busca em uma string é como a ação de procurar por uma palavra específica no livro, anotando em qual página ela está.
O método indexOf() recebe como argumento a sequência de caracteres que desejamos encontrar na string.
Ele retorna a posição da primeira ocorrência dessa sequência na string. Caso a sequência não seja encontrada, o método retorna -1.
Vejamos um exemplo para ilustrar melhor:
const frase = "O JavaScript é uma linguagem de programação poderosa";
const posicao = frase.indexOf("JavaScript");
console.log(posicao); // Resultado: 2
Neste exemplo, estamos buscando a sequência “JavaScript” na frase. Utilizando o método indexOf(), obtemos a posição em que essa sequência começa na string.
Nesse caso, a posição é 2, indicando que a sequência “JavaScript” começa no terceiro caractere da string.
Se a sequência não for encontrada, o método retorna -1:
const frase = "O JavaScript é uma linguagem de programação poderosa";
const posicao = frase.indexOf("Python");
console.log(posicao); // Resultado: -1
Neste caso, estamos buscando a sequência “Python” na frase, que não está presente. O método indexOf() retorna -1, indicando que a sequência não foi encontrada.
Dessa forma, o método indexOf() nos permite buscar por uma sequência de caracteres específica dentro de uma string e obter a posição em que ela ocorre. Assim como procurar por uma palavra em um livro e anotar em qual página ela está.
Desafio:
- Crie um script JavaScript que recebe um nome completo do usuário como entrada.
- Converta o nome completo para maiúsculas.
- Extraia o primeiro nome utilizando indexOf e substring.
- Formate o primeiro nome com o sobrenome, separando-os por um espaço e exibindo o resultado.
Agora que aprendemos sobre várias manipulações de strings em JavaScript, estamos prontos para dar um passo adiante e explorar um conceito fundamental: objetos em JavaScript.
