Introdução
Neste laboratório, você explorará os métodos essenciais do objeto string em JavaScript para manipular e transformar dados de texto. Através de uma série de exercícios práticos de codificação, você aprenderá a criar strings, verificar seu comprimento, converter a capitalização, extrair caracteres, substituir conteúdo e encontrar posições de caracteres usando métodos de string embutidos em JavaScript.
O laboratório cobre técnicas fundamentais de manipulação de strings, como usar a propriedade length para determinar o tamanho da string, toLowerCase() e toUpperCase() para conversão de capitalização, charAt() e substring() para extração de caracteres, substituição e divisão de strings, e indexOf() para localizar caracteres específicos dentro de uma string. Ao trabalhar nestas etapas, você obterá experiência prática com operações de string essenciais que são cruciais para o processamento de texto eficaz na programação JavaScript.
Crie uma String e Verifique Seu Comprimento
Nesta etapa, você aprenderá como criar strings em JavaScript e verificar seu comprimento usando a propriedade length. Strings são tipos de dados fundamentais em JavaScript, usados para armazenar e manipular texto.
Abra o WebIDE e crie um novo arquivo chamado string-basics.js no diretório ~/project. Escreveremos nosso código JavaScript para explorar a criação de strings e a verificação de comprimento.
// Criando uma string usando diferentes métodos
let greeting = "Olá, JavaScript!";
let name = "John Doe";
let emptyString = "";
// Verificando o comprimento da string usando a propriedade length
console.log("Comprimento da saudação:", greeting.length);
console.log("Comprimento do nome:", name.length);
console.log("Comprimento da string vazia:", emptyString.length);
Quando você executar este código, verá o comprimento de cada string impresso no console. A propriedade length retorna o número de caracteres em uma string.
Exemplo de saída:
Comprimento da saudação: 18
Comprimento do nome: 8
Comprimento da string vazia: 0
Alguns pontos-chave para lembrar:
- Strings podem ser criadas usando aspas simples
''ou aspas duplas"". - A propriedade
lengthfunciona em qualquer string, incluindo strings vazias. - Espaços e sinais de pontuação são contados no comprimento da string.
Converta a Caixa da String com toLowerCase() e toUpperCase()
Nesta etapa, você aprenderá como converter a capitalização de strings usando dois métodos essenciais de string em JavaScript: toLowerCase() e toUpperCase(). Esses métodos permitem que você altere a capitalização de strings facilmente.
Abra o WebIDE e continue trabalhando no arquivo ~/project/string-basics.js da etapa anterior. Adicione o seguinte código para explorar a conversão de capitalização:
// String original
let originalText = "Olá, Programação JavaScript!";
// Converter para minúsculas
let lowercaseText = originalText.toLowerCase();
console.log("Minúsculas:", lowercaseText);
// Converter para maiúsculas
let uppercaseText = originalText.toLowerCase().toUpperCase();
console.log("Maiúsculas:", uppercaseText);
// Exemplo prático: normalização de nome de usuário
let username = "JohnDoe";
let normalizedUsername = username.toLowerCase();
console.log("Nome de Usuário Normalizado:", normalizedUsername);
Quando você executar este código, verá a seguinte saída:
Exemplo de saída:
Minúsculas: olá, programação javascript!
Maiúsculas: OLÁ, PROGRAMAÇÃO JAVASCRIPT!
Nome de Usuário Normalizado: johndoe
Pontos-chave sobre os métodos de conversão de capitalização:
toLowerCase()converte todos os caracteres em uma string para minúsculastoUpperCase()converte todos os caracteres em uma string para maiúsculas- Esses métodos são úteis para comparação de strings, normalização e formatação
- A string original permanece inalterada; esses métodos retornam uma nova string
Extraia Caracteres e Substrings com charAt() e substring()
Nesta etapa, você aprenderá como extrair caracteres individuais e substrings de uma string usando os métodos charAt() e substring() em JavaScript.
Abra o WebIDE e continue trabalhando no arquivo ~/project/string-basics.js. Adicione o seguinte código para explorar a extração de caracteres e substrings:
// String original
let message = "JavaScript é incrível!";
// Extrair um único caractere usando charAt()
let firstChar = message.charAt(0);
let fifthChar = message.charAt(4);
console.log("Primeiro caractere:", firstChar);
console.log("Quinto caractere:", fifthChar);
// Extrair substrings usando substring()
let partialString1 = message.substring(0, 10);
let partialString2 = message.substring(11);
console.log("Primeiros 10 caracteres:", partialString1);
console.log("A partir do 11º caractere:", partialString2);
// Exemplo prático: extraindo o nome de usuário do e-mail
let email = "john.doe@example.com";
let username = email.substring(0, email.indexOf("@"));
console.log("Nome de usuário:", username);
Quando você executar este código, verá a seguinte saída:
Exemplo de saída:
Primeiro caractere: J
Quinto caractere: S
Primeiros 10 caracteres: JavaScript
A partir do 11º caractere: is awesome!
Nome de usuário: john.doe
Pontos-chave sobre a extração de caracteres e substrings:
charAt(index)retorna o caractere em um índice específico (indexado a partir de zero)substring(startIndex, endIndex)extrai uma porção da string- Se nenhum índice final for fornecido,
substring()extrai até o final da string - Os índices começam em 0, então o primeiro caractere está no índice 0
Substitua e Divida o Conteúdo da String
Nesta etapa, você aprenderá como manipular strings usando os métodos replace() e split() em JavaScript. Esses métodos são ferramentas poderosas para modificar e dividir o conteúdo de strings.
Abra o WebIDE e continue trabalhando no arquivo ~/project/string-basics.js. Adicione o seguinte código para explorar a substituição e divisão de strings:
// String original
let sentence = "Olá, mundo! Bem-vindo à programação JavaScript.";
// Método replace: substituir palavras ou caracteres específicos
let replacedSentence = sentence.replace("mundo", "JavaScript");
console.log("Sentença substituída:", replacedSentence);
// Substituição global usando expressão regular
let cleanedSentence = sentence.replace(/[!.]/g, "");
console.log("Sentença limpa:", cleanedSentence);
// Método split: converter string em um array
let words = sentence.split(" ");
console.log("Array de palavras:", words);
// Split com limite
let limitedWords = sentence.split(" ", 3);
console.log("Palavras limitadas:", limitedWords);
// Exemplo prático: análise de dados semelhantes a CSV
let userData = "João,Silva,30,Desenvolvedor";
let userDetails = userData.split(",");
console.log("Primeiro nome do usuário:", userDetails[0]);
console.log("Sobrenome do usuário:", userDetails[1]);
Quando você executar este código, verá a seguinte saída:
Exemplo de saída:
Sentença substituída: Olá, JavaScript! Bem-vindo à programação JavaScript.
Sentença limpa: Olá, mundo Bem-vindo à programação JavaScript
Array de palavras: [ 'Olá,', 'mundo!', 'Bem-vindo', 'à', 'programação', 'JavaScript.' ]
Palavras limitadas: [ 'Olá,', 'mundo!', 'Bem-vindo' ]
Primeiro nome do usuário: João
Sobrenome do usuário: Silva
Pontos-chave sobre replace() e split():
replace()substitui parte de uma string por outra string- Use expressões regulares com
replace()para substituições globais split()divide uma string em um array com base em um separadorsplit()pode receber um parâmetro de limite opcional para controlar o número de divisões
Encontre Posições de Caracteres com indexOf()
Nesta etapa, você aprenderá como encontrar a posição de caracteres ou substrings dentro de uma string usando o método indexOf() em JavaScript. Este método é crucial para pesquisar e localizar conteúdo específico dentro de strings.
Abra o WebIDE e continue trabalhando no arquivo ~/project/string-basics.js. Adicione o seguinte código para explorar o posicionamento de caracteres e substrings:
// String original
let message = "Olá, JavaScript é incrível!";
// Encontrar a posição de um caractere
let commaPosition = message.indexOf(",");
let firstJPosition = message.indexOf("J");
console.log("Posição da vírgula:", commaPosition);
console.log("Primeira posição de 'J':", firstJPosition);
// Encontrar a posição de uma substring
let javascriptPosition = message.indexOf("JavaScript");
console.log("Posição de 'JavaScript':", javascriptPosition);
// Encontrar um caractere a partir de um índice específico
let secondJPosition = message.indexOf("J", commaPosition + 1);
console.log("Segunda posição de 'J':", secondJPosition);
// Lidando com caracteres não encontrados
let xPosition = message.indexOf("X");
console.log("Posição de 'X':", xPosition);
// Exemplo prático: validação de e-mail
let email = "user@example.com";
let atSymbolPosition = email.indexOf("@");
let domainName = email.substring(atSymbolPosition + 1);
console.log("Nome de domínio:", domainName);
Quando você executar este código, verá a seguinte saída:
Exemplo de saída:
Posição da vírgula: 3
Primeira posição de 'J': 7
Posição de 'JavaScript': 7
Segunda posição de 'J': 7
Posição de 'X': -1
Nome de domínio: example.com
Pontos-chave sobre indexOf():
- Retorna o primeiro índice onde o caractere ou substring especificado é encontrado
- Se o caractere/substring não for encontrado, ele retorna -1
- Pode começar a pesquisar a partir de um índice específico usando um segundo parâmetro opcional
- Útil para pesquisar, validar e extrair partes de strings
Resumo
Neste laboratório, os participantes exploraram técnicas fundamentais de manipulação de strings em JavaScript, com foco em métodos e propriedades-chave. O laboratório guiou os alunos através da criação de strings, verificação de seus comprimentos e realização de conversões de caixa usando métodos como length, toLowerCase() e toUpperCase(). Os participantes aprenderam como criar strings com diferentes sintaxes, medir o comprimento de strings e transformar casos de texto dinamicamente.
Os exercícios práticos demonstraram operações essenciais de string, incluindo extração de caracteres, manipulação de substrings e compreensão da indexação de strings. Ao trabalhar com exemplos de código práticos, os alunos obtiveram insights práticos sobre os métodos de objeto string do JavaScript, permitindo que eles manipulassem e modificassem dados de texto de forma eficaz em seus projetos de programação.
