LabEx
ВходРегистрация

Красивый вывод количества байтов

Beginner

This tutorial is from open-source community. Access the source code

Введение

В этом лабораторном занятии (LabEx) мы рассмотрим концепцию красивого вывода чисел, представляющих размер в байтах, в человекочитаемом формате с использованием JavaScript. Мы научимся преобразовывать заданное количество байт в КБ, МБ, ГБ, ТБ, ПБ, ЭБ, ЗБ и ЙБ с помощью массива - словаря единиц измерения. С помощью метода Number.prototype.toPrecision() мы обрежем число до определенного количества знаков и создадим красиво отформатированную строку для отображения результата.

Преобразование байтов в человекочитаемую строку

Для преобразования числа, представляющего размер в байтах, в человекочитаемую строку используйте функцию prettyBytes(). Обратите внимание на следующие моменты:

  • Функция использует массив - словарь единиц измерения, который доступен на основе показателя степени.
  • Вы можете использовать второй аргумент, precision, чтобы обрезать число до определенного количества знаков. Значение по умолчанию - 3.
  • Вы можете использовать третий аргумент, addSpace, чтобы добавить пробел между числом и единицей измерения. Значение по умолчанию - true.
  • Функция возвращает красиво отформатированную строку, учитывая переданные параметры и то, является ли число отрицательным или нет.

Вот код функции prettyBytes():

const prettyBytes = (num, precision = 3, addSpace = true) => {
  const UNITS = ["B", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
  if (Math.abs(num) < 1) return num + (addSpace ? " " : "") + UNITS[0];
  const exponent = Math.min(
    Math.floor(Math.log10(num < 0 ? -num : num) / 3),
    UNITS.length - 1
  );
  const n = Number(
    ((num < 0 ? -num : num) / 1000 ** exponent).toPrecision(precision)
  );
  return (num < 0 ? "-" : "") + n + (addSpace ? " " : "") + UNITS[exponent];
};

А вот несколько примеров использования функции prettyBytes():

prettyBytes(1000); // '1 KB'
prettyBytes(-27145424323.5821, 5); // '-27.145 GB'
prettyBytes(123456789, 3, false); // '123MB'

Итог

Поздравляем! Вы завершили лабораторное занятие (LabEx) по красивому выводу числа байтов. Вы можете попрактиковаться в других лабораторных занятиях в LabEx, чтобы улучшить свои навыки.