Что такое Blob в JavaScript и для чего он используется?

Что проверяют

Умеете ли вы работать с бинарными данными в браузере: принять файл, собрать его на клиенте, показать пользователю, отправить на сервер. Это основа для загрузок, превью, экспорта и всего, что не укладывается в строку.

Как отвечать

Blob это неизменяемый кусок двоичных данных с типом содержимого. Создаётся из строк, ArrayBuffer, типизированных массивов или других Blob. File наследуется от Blob и добавляет имя и дату, поэтому файл из поля выбора обрабатывается ровно теми же средствами.

const blob = new Blob([text], { type: "text/csv" });
const url = URL.createObjectURL(blob);

Что с ним делают: читают через методы text, arrayBuffer и stream (FileReader это более старый путь с событиями); режут через slice, не копируя содержимое; отдают телом запроса в fetch или кладут в FormData; получают из ответа методом blob; подставляют ссылку из createObjectURL в src картинки или видео; собирают файл для сохранения.

Важная деталь про ссылки: createObjectURL держит данные живыми, пока страница открыта, поэтому после использования вызывают revokeObjectURL. Освобождать нужно тогда, когда ссылка уже точно не нужна.

Где спотыкаются

Освобождают ссылку слишком рано. Вызов revokeObjectURL сразу после клика или сразу после присвоения src отменяет сохранение и оставляет битую картинку, потому что загрузка начинается асинхронно.

Не освобождают вовсе. В интерфейсе, где превью пересоздаются на каждый выбор файла, вкладка спокойно набирает сотни мегабайт, и это не утечка в коде, а живые ссылки на данные.

Путают Blob, ArrayBuffer и base64. Base64 раздувает объём и держит всё строкой в памяти, для передачи и хранения в браузере достаточно самого Blob, а ArrayBuffer нужен, когда байты действительно разбирают вручную.