localstrageの有無によって処理を変更する

この記事を読むのにかかる時間 1未満

ポイント

  • ・localstrageを読み込む前に、使用できるか検証する(プライベートモードなどでは使えないため、エラー処理を適切に行う)

コード

// localStorageが使えるかを事前に確認する。使えない場合にエラーを返す
// localStorage を直接使うとエラーで処理が止まるため、事前チェックしている
// AAAは検証用のダミーキーであり、なんでも良い
// 書き込めるかのテストであり、setItemした後にすぐremoveItemをし、残さないようにしている
// tryでうまくいかなかったらcatchに移行する
function updateFavIcon() {    
  var isLocalStorageAvlbl = (function () {
    try {
      localStorage.setItem("AAA", true);
      localStorage.removeItem("AAA");
      return true;
    } catch (e) {
      return false;
    }
  })();

// localStorageにBBBのアイテムがあるかを探索する
// ①isLocalStorageAvlblがtrue(localStrageが使える)かどうかの確認
// ②BBBのアイテムがある場合に文字列を持ってくる
// JSON.parseは、localStrage内の配列状の記述をオブジェクトとして使用できる形式にする
var Item = isLocalStorageAvlbl ? // ①
    (!localStorage.getItem("BBB") ? [] : JSON.parse(localStorage.getItem("BBB")) // ②
  :[];

// Itemがある場合の処理はここから
if(Item.length){…

try,catchについて

try...catch...finallyの形式も存在する。

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/try…catch