JS метод Storage.clear()

Загальний опис

clear — це метод об'єктів localStorage або sessionStorage у JavaScript, який дозволяє видалити всі дані, збережені в обраному сховищі. Використовується для швидкого очищення всього сховища без потреби видаляти кожен елемент окремо. Метод викликається напряму на об’єкті localStorage або sessionStorage без аргументів.

Зазвичай, clear застосовується, коли потрібно видалити всі дані користувача в рамках поточної сесії або повністю обнулити сховище після виконання певної операції. Наприклад, це може бути корисно при завершенні роботи з веб-додатком, де слід стерти усі дані тимчасового збереження перед завершенням сесії.

Приклад використання

// Очищення всіх даних у sessionStorage
sessionStorage.clear();

// Очищення всіх даних у localStorage
localStorage.clear();

Після виклику clear, всі дані в сховищі будуть видалені, і доступ до попередньо збережених значень більше неможливий. У випадках, коли необхідно видалити лише певний ключ або значення, краще використовувати метод removeItem замість clear, який видаляє конкретний елемент.

Особливості застосування

Метод clear діє миттєво і не повертає жодних значень. Це означає, що код продовжить виконуватись навіть після виклику clear, а також метод не сповіщає про успішність видалення даних. clear може бути корисним для очищення проміжних даних, таких як збережені результати пошуку або проміжні налаштування.

Обмеження використання

Варто пам’ятати, що очищення всього сховища може мати небажані наслідки, оскільки метод видаляє всі ключі без винятку. Таким чином, його застосування потребує обережності, особливо якщо інші компоненти додатку використовують той же обсяг сховища для важливих даних.

Порада:	Перед тим як очистити сховище, рекомендується створити резервну копію даних, якщо вони можуть знадобитись знову. Це можна зробити через перебір всіх ключів і збереження даних у змінній або файлі, а потім за потреби відновити їх після `clear`.
Порада:	Перевірте тип сховища перед очищенням, щоб переконатися, що стираєте правильні дані. Наприклад, `localStorage` зберігає дані між сесіями, тоді як `sessionStorage` видаляє дані після закриття вкладки. Залежно від мети очищення, можна вибрати відповідний об'єкт.
Порада:	При розробці для кількох вкладок врахуйте, що очищення `localStorage` з однієї вкладки вплине на всі інші відкриті вкладки цього ж домену. Це дозволяє ефективно синхронізувати дані, але потребує обережності, якщо дані зберігаються лише для однієї вкладки.

Синтаксис

storage.clear();

Параметри

Return

undefined: Метод clear() не повертає жодного значення. Він виконує операцію очищення даних у сховищі (наприклад, у localStorage або sessionStorage), але не дає жодного результату у вигляді значення або повідомлення. Після його виклику всі дані, збережені у відповідному сховищі, будуть видалені, але метод не поверне нічого, тому його результат завжди undefined.

Переглядачі

Переглядач
	19	45	14	33	14

Переглядач
	-	-	48	15

Переглядач
	-	-

Приклади

Цей приклад демонструє використання методу Storage.clear() для очищення всього сховища localStorage. Користувач може додавати нові дані через форму, зберігати їх у сховищі, а потім очищати всі збережені елементи за допомогою кнопки. Складена система використовує унікальні ключі для кожного елементу, що дозволяє зберігати множинні дані. Кнопка очищення видаляє всі записи зі сховища, а список збережених елементів оновлюється кожного разу після додавання або очищення.


  See the Pen <a href="https://codepen.io/css_in_ua/pen/KKOrWJp">
  Untitled</a> by css.in.ua (<a href="https://codepen.io/css_in_ua">@css_in_ua</a>)
  on <a href="https://codepen.io">CodePen</a>.

Цей приклад показує, як очищення всіх даних з localStorage може бути корисним після виходу користувача з системи. Таким чином забезпечується, що конфіденційні дані користувача, наприклад токени авторизації або налаштування, видаляються і недоступні для інших користувачів пристрою.

function logoutUser() {
    // Очистити дані після виходу
    localStorage.clear();
    alert("Ви вийшли з системи. Всі ваші дані видалено.");
}

Цей код перевіряє наявність тимчасових даних і очищає їх із sessionStorage після завершення сесії або виконання певної операції. Це особливо корисно для видалення проміжних результатів обчислень або незбережених форм, коли користувач залишає сторінку чи застосунок.

function clearSessionData() {
    if (sessionStorage.getItem("temporaryData")) {
        sessionStorage.clear();
        console.log("Тимчасові дані очищено.");
    }
}

JS довідник

JavaScript

Наповнення JS розділу