localstorage_proxy.js

// see: https://davidwalsh.name/javascript-proxy-with-storage
function getStorage() {
  return new Proxy(window.localStorage, {
    // just a helper to see if value is valid json ie stringified obj or array
    set: (obj, prop, value) => {
      value !== null && typeof value === 'object'
        ? obj.setItem(prop, JSON.stringify(value))
        : obj.setItem(prop, value);
      console.log(`${prop} added to localstorage!😀`);
    },
    get: (obj, prop) => {
      isJson = (str) => {
        if (typeof str !== 'string') return false;
        try {
          const result = JSON.parse(str);
          const type = Object.prototype.toString.call(result);
          return type === '[object Object]' || type === '[object Array]';
        } catch (err) {
          return false;
        }
      };
      const value = obj.getItem(prop);
      if (isJson(value)) {
        const parsed = JSON.parse(value);
        return parsed;
      }
      return value;
    },
  });
}

const StorageRef = getStorage(localStorage);
StorageRef.newProp = 'see what happens in console.log  😀';
console.log('StorageRef.newProp', StorageRef.newProp);
StorageRef.something = { a: 1, b: ['s'] };
console.log('StorageRef.somethin', StorageRef.something);