はじめに
はじめまして。
某金融系会社でシステムテスト、ホームページのリグレッションテストを主に実施しています。
Qiitaはずっと読んでいるばかりだったのですが、やはりどの記事でも
勉強したらアウトプットが大切！
と仰っていたので、初心者もいいところですが、アウトプットの場として使わせていただければと思います。
投稿するのは恐らくJavaScriptとUiPathについてが多くなると思います。
よろしくおねがいします。
それでは。
Twitterは自分からは載せません……ゲームの話ばかりで恥ずかしい
そもそもなんでローカルストレージを学んだのか？
知るきっかけは、システムテストをしている際に、
ローカルストレージを利用して、ユーザ設定値を保存している
という機能でした。
なんとなく聞いたことあるけれども、そういえばきちんと理解したことはないな、と思い調べてみました。
また、CookieやSessionについても、きちんと理解したことはなかったので
これを期にちゃんと勉強しよう、と思った次第です。
ローカルストレージとは
ローカルストレージとは、その名の通りではありますが、各ブラウザのローカルで保存するストレージのことです。
調べた際にそのように出てきて、そりゃそうだろうよ、となったので、もう少し調べて、自分なりに解釈してみました。
Qiitaでは、 @pipiox さんが書かれた
CookieとWebStorageとSessionについてのまとめ
を参考にさせて頂きました。有り難うございます。
- 情報をユーザのブラウザに保存しておく機能
- "key":"value"という、keyに対応したvalueが1セットで保存される
- どちらも文字列でのみ保存される
- 自分で明示的に削除しない限り、半永久的に保存される
- サーバとのやり取りは発生しない
というのがローカルストレージの特徴でしょうか。
実際に、どうやってローカルストレージにアクセスするのか
JavaScriptの簡単なコードによってアクセスが可能です。
ローカルストレージにセットするとき
localStorageプロパティのsetItem()メソッドで値をセットします。
localStorage.setItem(key, value);
ローカルストレージから値を取得するとき
localStorageプロパティのgetItem()メソッドで値を取得します。
戻りはvalueに保存している文字列です。
localStorage.getItem(key);
ローカルストレージの一つの値を削除するとき
localStorageプロパティのremoveItem()メソッドで値を削除できます。
keyに対応するもののみを削除します。
localStorage.removeItem(key);
ローカルストレージすべてを削除するとき
localStorageプロパティのclear()メソッドで値を削除できます。
removeItem()と違い、こちらはすべて削除します。
localStorage.clear();
以上になります。
valueにセットする際、オブジェクトを渡すこともできるそうなのですが、
私はまだどうすればよいかわからず…。
今回ローカルストレージで簡単なToDoリストを作ってみようと思ったのもありますので、
不要かな、と……。
ゆくゆくはしっかり調べて使えるようになりたいな、とは思います！
お読み頂き、ありがとうございました！