Web Storage API

1. Web Storage API の概要

Web Storage API は、ブラウザ内でデータを保存および取得するためのシンプルな構文（Syntax）を提供します。非常に直感的で使いやすいのが特徴です。

実装例

// データの保存
localStorage.setItem("name", "John Doe");
// データの取得
localStorage.getItem("name");

Web Storage API は、以下のすべてのブラウザでサポートされています。

2. localStorage オブジェクト

localStorage オブジェクトは、特定のウェブサイトのローカルストレージへのアクセスを提供します。これにより、そのドメインに対してデータの保存、読み取り、追加、修正、削除を行うことができます。

localStorage の最大の特徴は、データに有効期限がないことです。ブラウザを閉じてもデータは削除されず、数日、数週間、あるいは数年後でも利用可能です。

2.1 setItem() メソッド

localStorage.setItem() メソッドは、ストレージにデータアイテムを保存します。
パラメータとして「名前（キー）」と「値」を受け取ります。

実装例

// "name" というキーで "John Doe" を保存
localStorage.setItem("name", "John Doe");

2.2 getItem() メソッド

localStorage.getItem() メソッドは、ストレージからデータアイテムを取得します。
パラメータとして「名前（キー）」を受け取ります。

実装例

// "name" というキーのデータを取得
localStorage.getItem("name");

3. sessionStorage オブジェクト

sessionStorage オブジェクトは、localStorage オブジェクトとほぼ同一の機能を持ちます。

唯一の決定的な違いは、sessionStorage は1つのセッションの間だけデータを保存するという点です。ユーザーがブラウザ（タブ）を閉じると、保存されていたデータは自動的に削除されます。

実装例

// セッションストレージからデータを取得
sessionStorage.getItem("name");

3.1 setItem() メソッド（sessionStorage）

sessionStorage.setItem() メソッドは、現在のセッションストレージにデータアイテムを保存します。
パラメータとして「名前」と「値」を受け取ります。

実装例

// セッション単位でデータを保存
sessionStorage.setItem("name", "John Doe");

3.2 getItem() メソッド（sessionStorage）

sessionStorage.getItem() メソッドは、現在のセッションストレージからデータアイテムを取得します。
パラメータとして「名前」を受け取ります。

実装例

// セッションストレージから特定のキーのデータを取得
sessionStorage.getItem("name");