JavaScriptでローカルストレージ全削除！clear()メソッドの使い方

JavaScriptでローカルストレージ（Local Storage）のデータを全て削除する方法について解説します。

clear()メソッドの基本的な使い方

ローカルストレージの全データを削除するには、`localStorage.clear()`メソッドを使用します。

localStorage.clear();

このメソッドを実行すると、現在のドメインに紐づくローカルストレージのデータが全て削除されます。

使用例

実際の使用例を見てみましょう。

// データの保存
localStorage.setItem('name', 'John');
localStorage.setItem('age', '25');
localStorage.setItem('email', 'john@example.com');

// 全データの削除
localStorage.clear();

// 確認（空の値が返される）
console.log(localStorage.getItem('name')); // null
console.log(localStorage.getItem('age')); // null
console.log(localStorage.getItem('email')); // null

注意点

1. `clear()`メソッドは取り消しができません

2. 削除されるのは現在のドメインのデータのみです

3. 他のドメインのローカルストレージには影響しません

特定のデータのみを削除したい場合

全データではなく、特定のデータのみを削除したい場合は、`removeItem()`メソッドを使用します。

// 特定のキーのデータのみを削除
localStorage.removeItem('name');

エラー処理

ローカルストレージの操作時には、エラーが発生する可能性があるため、try-catch文での対応を推奨します。

try {
  localStorage.clear();
} catch (e) {
  console.error('ローカルストレージの削除に失敗しました:', e);
}

ブラウザ対応状況

`localStorage.clear()`メソッドは、以下のブラウザで使用可能です：

• Google Chrome

• Firefox

• Safari

• Microsoft Edge

• Internet Explorer 8以降

以上が、JavaScriptでローカルストレージを全削除する方法の解説でした。シンプルな機能ですが、データの管理やプライバシー保護の観点で重要な役割を果たします。