web storage两种存储方式:localStorage和sessionStorage

HTML5种的web storage包含两种存储方式:localStorage和sessionStorage,这两种方式存储的数据不会自动发给服务器,仅仅是本地保存,有大小限制。

localStorage是持久化的本地保存,除非主动删除,不然会一直存在,而且在所有的同源窗口中都是可以共享的;

sessionStorage是会话级别的本地保存,比如一个页面关闭的时候该页面设置的sessionStorage数据会自动消失,在不同浏览器窗口不会共享的,即使是同一个浏览器的同一个页面。

两者拥有一些共同的方法:

****window.localStorage存储的数据关闭页面后再重新打开数据还会存在,不会消失。

window.localStorage.setItem(key,value);//设置指定key的数据(JSON格式)

window.localStorage.getItem(key);//获取指定key的数据

window.localStorage.removeItem(key);//删除指定key的数据

window.localStorage.clear();//清空所有的存储数据


****window.sessionStorage存储的数据关闭页面后数据就会消失。

window.sessionStorage.setItem(key,value);

window.sessionStorage.getItem(key);

window.sessionStorage.removeItem(key);

window.sessionStorage.clear();

单独封装的缓存js

(function() {

    'use strict';

    app.factory('LocalCache',['$window',function($window){

      return{

        setSession:function(key,value){

          $window.sessionStorage[key]=value;

        },

        getSession:function(key,defaultValue){

          return  $window.sessionStorage[key] || defaultValue;

        },

        //存储单个属性

        set :function(key,value){

          $window.localStorage[key]=value;

        },        //读取单个属性

        get:function(key,defaultValue){

          return  $window.localStorage[key] || defaultValue;

        },        //存储对象,以JSON格式存储

        setObject:function(key,value){

          $window.sessionStorage[key]=JSON.stringify(value);

        },        //读取对象

        getObject: function (key) {

          return JSON.parse($window.sessionStorage[key] || '{}');

        }, // 清空缓存

        clearDate:function(){

          $window.sessionStorage.clear();

        }

      };

  }]);

})();

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容