Calculando o Tamanho em Bytes de uma String

Introdução

Neste laboratório, exploraremos como calcular o tamanho em bytes de uma string usando JavaScript. Compreender o tamanho em bytes de strings é essencial ao trabalhar com transferência de dados, cálculos de armazenamento ou limitações de API onde o tamanho dos dados é importante.

Aprenderemos como converter uma string em um objeto Blob e usar suas propriedades para determinar o tamanho exato em bytes. Essa técnica é comumente usada no desenvolvimento web ao lidar com uploads de arquivos, requisições de rede ou otimização de armazenamento de dados.

Compreendendo a Representação de Strings em JavaScript

Antes de calcular o tamanho em bytes de strings, é importante entender como as strings são representadas em JavaScript.

Em JavaScript, strings são sequências de unidades de código UTF-16. Isso significa que caracteres como emojis ou certos símbolos podem levar mais de um byte para serem representados. Por exemplo, uma simples letra em inglês ocupa 1 byte, mas um emoji pode ocupar 4 bytes.

Vamos começar lançando o Node.js no terminal:

1. Abra o Terminal clicando no ícone do terminal na interface WebIDE
2. Digite o seguinte comando e pressione Enter:

node

Você deve estar agora no console interativo do Node.js, que se parece com isto:

Welcome to Node.js v14.x.x.
Type ".help" for more information.
>

Neste console, podemos experimentar o código JavaScript diretamente. Tente digitar o seguinte comando para ver o comprimento de uma string:

"Hello World".length;

Você deve ver a saída:

11

Isso nos dá a contagem de caracteres, mas não o tamanho real em bytes. A contagem de caracteres e o tamanho em bytes podem ser diferentes, especialmente com caracteres especiais. Vamos explorar isso mais a fundo no próximo passo.

Usando Blob para Calcular o Tamanho em Bytes de uma String

Agora que entendemos a representação de strings, vamos aprender como calcular o tamanho real em bytes de uma string usando o objeto Blob.

Um Blob (Binary Large Object) representa um objeto semelhante a um arquivo de dados brutos e imutáveis. Ao converter nossa string em um Blob, podemos acessar sua propriedade size para determinar o tamanho em bytes.

No console do Node.js, vamos criar uma função para calcular o tamanho em bytes:

const byteSize = (str) => new Blob([str]).size;

Esta função recebe uma string como entrada, a converte em um Blob e retorna seu tamanho em bytes.

Vamos testar esta função com um exemplo simples:

byteSize("Hello World");

Você deve ver a saída:

11

Neste caso, a contagem de caracteres e o tamanho em bytes são os mesmos porque "Hello World" contém apenas caracteres ASCII, cada um representado por um único byte.

Agora vamos tentar com um caractere não-ASCII:

byteSize("😀");

Você deve ver a saída:

4

Isso mostra que, embora o emoji apareça como um único caractere, ele realmente ocupa 4 bytes de armazenamento.

Testando com Diferentes Tipos de Strings

Vamos explorar como diferentes tipos de caracteres afetam o tamanho em bytes de uma string.

No console do Node.js, vamos testar nossa função byteSize com várias strings:

1. Texto em inglês simples:

byteSize("The quick brown fox jumps over the lazy dog");

Saída esperada:

43

2. Números e caracteres especiais:

byteSize("123!@#$%^&*()");

Saída esperada:

13

3. Uma mistura de caracteres ASCII e não-ASCII:

byteSize("Hello, 世界！");

Saída esperada:

13

4. Múltiplos emojis:

byteSize("😀😃😄😁");

Saída esperada:

16

Observe que com os tipos de caracteres mistos, especialmente com caracteres não-ASCII como caracteres chineses e emojis, o tamanho em bytes é maior do que a contagem de caracteres.

Isso é importante para entender ao trabalhar com dados que podem conter caracteres internacionais ou símbolos especiais, pois afeta os requisitos de armazenamento e os tamanhos de transferência de dados.

Vamos sair do console do Node.js digitando:

.exit

Isso o retornará ao prompt normal do terminal.

Criando um Arquivo de Exemplo Prático

Agora, vamos criar um arquivo JavaScript para implementar nossa função de tamanho em bytes de uma forma mais prática. Isso demonstrará como você pode usar essa função em uma aplicação do mundo real.

1. Crie um novo arquivo no WebIDE. Clique no ícone "Novo Arquivo" na barra lateral do explorador de arquivos e nomeie-o byteSizeCalculator.js.

2. Adicione o seguinte código ao arquivo:

/**
 * Calcula o tamanho em bytes de uma determinada string.
 * @param {string} str - A string para calcular o tamanho em bytes.
 * @returns {number} O tamanho em bytes.
 */
function calculateByteSize(str) {
  return new Blob([str]).size;
}

// Exemplos com diferentes tipos de strings
const examples = [
  "Hello World",
  "😀",
  "The quick brown fox jumps over the lazy dog",
  "123!@#$%^&*()",
  "Hello, 世界！",
  "😀😃😄😁"
];

// Exibe os resultados
console.log("Calculadora de Tamanho em Bytes de String\n");
console.log("String".padEnd(45) + "| Caracteres | Bytes");
console.log("-".repeat(70));

examples.forEach((example) => {
  console.log(
    `"${example}"`.padEnd(45) +
      `| ${example.length}`.padEnd(12) +
      `| ${calculateByteSize(example)}`
  );
});

3. Salve o arquivo pressionando Ctrl+S ou selecionando Arquivo > Salvar no menu.

4. Execute o arquivo a partir do terminal:

node byteSizeCalculator.js

Você deve ver uma saída semelhante a esta:

Calculadora de Tamanho em Bytes de String

String                                      | Caracteres | Bytes
----------------------------------------------------------------------
"Hello World"                               | 11         | 11
"😀"                                        | 1          | 4
"The quick brown fox jumps over the lazy dog" | 43         | 43
"123!@#$%^&*()"                            | 13         | 13
"Hello, 世界!"                              | 10         | 13
"😀😃😄😁"                                  | 4          | 16

Esta tabela mostra claramente a diferença entre a contagem de caracteres e o tamanho em bytes para diferentes tipos de strings.

Compreender essas diferenças é crucial ao:

• Definir limites na entrada do usuário em formulários da web
• Calcular os requisitos de armazenamento para dados de texto
• Trabalhar com APIs que têm limitações de tamanho
• Otimizar a transferência de dados em redes

Resumo

Parabéns por concluir o laboratório de Cálculo do Tamanho em Bytes de String. Você aprendeu:

1. Como as strings são representadas em JavaScript como unidades de código UTF-16
2. Como usar o objeto Blob para calcular o tamanho em bytes de uma string
3. A diferença entre a contagem de caracteres e o tamanho em bytes para vários tipos de caracteres
4. Como criar um utilitário prático para calcular tamanhos em bytes de strings

Este conhecimento é valioso ao trabalhar com:

• Aplicações web que lidam com entrada do usuário
• Sistemas de armazenamento de dados
• Requisições de rede e APIs com limitações de tamanho
• Aplicações de internacionalização e multilíngues

Compreender os tamanhos em bytes de strings ajuda a garantir que suas aplicações gerenciem corretamente o armazenamento e a transferência de dados, especialmente ao lidar com caracteres internacionais, emojis e símbolos especiais.