Como Exibir o Tamanho do Arquivo em um Formato Legível em Javascript

Ao lidar com arquivos, geralmente é benéfico apresentar o tamanho do arquivo em um formato compreensível. Por padrão, os tamanhos de arquivo são fornecidos em bytes, o que pode confundir a maioria dos usuários. Para tornar o tamanho do arquivo mais legível, podemos modificá-lo em um formato facilmente digerível, como kilobytes ou megabytes.

A Função `readableFileSize`

Um método para transformar o tamanho do arquivo em um formato facilmente compreensível envolve o desenvolvimento de uma função que aceita um valor numérico como entrada, significando o tamanho do arquivo em bytes. Esta função subsequentemente altera o tamanho do arquivo em kilobytes ou megabytes, com base nas dimensões do arquivo. Por fim, a função gera uma representação textual do tamanho do arquivo em kilobytes ou megabytes.

A seguir está a implementação da função readableFileSize:

export function readableFileSize(attachmentSize) {
  const DEFAULT_SIZE = 0;
  const fileSize = attachmentSize ?? DEFAULT_SIZE;

  if (!fileSize) {
    return `${DEFAULT_SIZE} kb`;
  }

  const sizeInKb = fileSize / 1024;

  if (sizeInKb > 1024) {
    return `${(sizeInKb / 1024).toFixed(2)} mb`;
  } else {
    return `${sizeInKb.toFixed(2)} kb`;  
  }
}

Agora vamos dissecar a implementação da função e examinar seu funcionamento interno.

Valor Padrão

A função começa atribuindo um valor padrão ao tamanho do arquivo. Se o parâmetro attachmentSize for undefined, um tamanho padrão de 0 bytes é usado. Isso é obtido usando o operador de coalescência nula (??), que retorna o operando do lado direito se o operando do lado esquerdo for nulo ou indefinido.

const DEFAULT_SIZE = 0;
const fileSize = attachmentSize ?? DEFAULT_SIZE;

Verificar Tamanho Vazio

Em seguida, a função examina se o tamanho do arquivo é 0 ou undefined. Se o tamanho do arquivo for 0 ou undefined, o tamanho padrão em kilobytes é retornado.

if (!fileSize) {
  return `${DEFAULT_SIZE} kb`;
}

Converter para Kilobytes ou Megabytes

Subsequentemente, a função ajusta o tamanho do arquivo para kilobytes ou megabytes, dependendo do tamanho do arquivo. Se o tamanho do arquivo for menor ou igual a 1024 kilobytes, o tamanho do arquivo em kilobytes é retornado. Caso contrário, o tamanho do arquivo é convertido para megabytes e retornado nesse formato.

const sizeInKb = fileSize / 1024;

if (sizeInKb > 1024) {
  return `${(sizeInKb / 1024).toFixed(2)} mb`;
} else {
  return `${sizeInKb.toFixed(2)} kb`;
}

Para converter o tamanho do arquivo para kilobytes, a função divide o tamanho do arquivo por 1024. Se o tamanho do arquivo exceder 1024 kilobytes (ou seja, 1 megabyte ou mais), o tamanho do arquivo é dividido por 1024 novamente para convertê-lo em megabytes. O método toFixed arredonda o tamanho do arquivo para duas casas decimais.

Exemplo de Uso

Aqui está um exemplo demonstrando a utilização da função readableFileSize:

const fileSizeInBytes = 256640;
const fileSize = readableFileSize(fileSizeInBytes); // Saída: "250.31 kb"

Neste exemplo, o tamanho do arquivo em bytes (256640) é passado para a função readableFileSize, que retorna uma representação de string do tamanho do arquivo em kilobytes (250.31 kb).

Conclusão

A função readableFileSize é uma função utilitária simples, mas prática, para converter o tamanho do arquivo em um formato mais legível. Ao exibir o tamanho do arquivo em kilobytes ou megabytes, os usuários podem compreender mais facilmente a quantidade de dados que estão manipulando. Isso é particularmente útil ao trabalhar com arquivos grandes, onde o tamanho do arquivo em bytes pode ser difícil de entender.

Como Exibir o Tamanho do Arquivo em um Formato Legível em Javascript ​

A Função readableFileSize ​

Valor Padrão ​

Verificar Tamanho Vazio ​

Converter para Kilobytes ou Megabytes ​

Exemplo de Uso ​

Conclusão ​