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

Область видимости: Cookies доступны как на стороне клиента, так и на стороне сервера. sessionStorage и localStorage доступны только на стороне клиента.

Время жизни: Для cookies время жизни устанавливается при создании (с помощью атрибута expires или max-age). Если не указано, cookie удаляется при закрытии браузера. sessionStorage хранит данные только в течение текущей сессии (до закрытия вкладки или окна браузера). localStorage хранит данные бессрочно, пока они не будут явно удалены.

Размер: Максимальный размер для cookies составляет около 4 КБ. Для sessionStorage и localStorage — от 5 МБ до 10 МБ, зависит от браузера.

Отправка с каждым запросом: Cookies автоматически отправляются с каждым HTTP-запросом к домену, для которого они установлены, что может увеличить трафик. Данные в sessionStorage и localStorage не отправляются на сервер.

Способ доступа: Доступ к cookies осуществляется через document.cookie (строка). Доступ к sessionStorage и localStorage осуществляется через соответствующие объекты с использованием методов setItem, getItem, removeItem и clear.

// Установка cookie
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2023 12:00:00 UTC; path=/";

// Получение cookie
let x = document.cookie;

// Установка данных в sessionStorage
sessionStorage.setItem("lastname", "Smith");

// Получение данных из sessionStorage
let y = sessionStorage.getItem("lastname");

// Установка данных в localStorage
localStorage.setItem("firstname", "Jane");

// Получение данных из localStorage
let z = localStorage.getItem("firstname");