Объясните разницу между cookies, sessionStorage и localStorage.

Cookies:

• Отправляются с каждым HTTP-запросом на сервер, что может увеличить трафик.
• Основное назначение: идентификация пользователя (сессионные куки), запоминание предпочтений, отслеживание действий пользователя.
• Доступны как на стороне клиента (JavaScript), так и на стороне сервера.
• Могут быть ограничены по домену и пути.
• Считаются менее безопасными для хранения чувствительных данных из-за автоматической отправки на сервер.

localStorage:

• Данные хранятся локально в браузере пользователя.
• Используется для постоянного хранения данных, которые не требуется отправлять на сервер при каждом запросе.
• Имеет простой JavaScript API.
• Данные хранятся в виде пар ключ-значение.
• Недоступен с других origin'ов.

// Установка значения
localStorage.setItem('username', 'john.doe');

// Получение значения
let username = localStorage.getItem('username');

// Удаление значения
localStorage.removeItem('username');

// Очистка всего localStorage
localStorage.clear();

sessionStorage:

• Аналогичен localStorage, но данные хранятся только до закрытия текущей вкладки или окна браузера.
• Идеально подходит для временного хранения данных, связанных с текущей сессией пользователя (например, данные формы, корзина интернет-магазина).
• Также имеет простой JavaScript API, аналогичный localStorage.
• Данные доступны только на текущем origin'е.

// Установка значения
sessionStorage.setItem('sessionId', 'abc123');

// Получение значения
let sessionId = sessionStorage.getItem('sessionId');

// Удаление значения
sessionStorage.removeItem('sessionId');

// Очистка всего sessionStorage
sessionStorage.clear();