分享8个JavaScript库可更好地处理本地存储


Posted in Javascript onOctober 12, 2020

我为当前项目测试了一些本地存储库。想知道他们有什么很棒的功能吗?继续阅读。

Local Storage Bridge

https://github.com/krasimir/lsbridge

如果你必须在同一个浏览器中从一个标签页发送消息到另一个标签页,你不必用艰难的方式。Local storage bridge在这里让任务变得更简单。

基本使用:

// 发送
lsbridge.send(‘app.message.error', { error: ‘Out of memory' });

// 监听
lsbridge.subscribe(‘app.message.error', function(data) {
 console.log(data); // { error: ‘Out of memory' }
});

Basil.js

分享8个JavaScript库可更好地处理本地存储

Basil.js统一了session、localStorage和cookie,为你提供了一种处理数据的直接方法。

基本使用:

let basil = new Basil(options);

basil.set(‘name', ‘Amy');
basil.get(‘name');
basil.remove(‘name');
basil.reset();

store.js

https://github.com/krasimir/lsbridge

Store.js像其他东西一样处理数据存储。但还有更多的功能,它的一个高级特性是让你更深入地访问浏览器支持。

基本使用:

store.set(‘book', { title: ‘JavaScript' }); // Store a book
store.get(‘book'); // Get stored book
store.remove(‘book'); // Remove stored book
store.clearAll(); // Clear all keys

lscache

https://github.com/pamelafox/lscache

它与localStorage API类似。事实上,它是localStorage的一个封装器,并使用HTML5模拟memcaches函数。在上面的文档中发现更多的功能。

基本使用:

lscache.set(‘name', ‘Amy', 5); // 数据将在5分钟后过期
lscache.get(‘name');

Lockr

分享8个JavaScript库可更好地处理本地存储

Lockr建立在localStorage API之上。它提供了一些有用的方法来更轻松地处理本地数据。

是什么让你要使用此库而不是localStorage API?

好吧,localStorage API仅允许你存储字符串。如果要存储数字,则需要先将该数字转换为字符串。在Lockr中不会发生这种情况,因为Lockr允许你存储更多的数据类型甚至对象。

基本使用:

Lockr.set(‘name', ‘Amy');
Lockr.set(‘age', 28);
Lockr.set(‘books', [{title: ‘JavaScript', price: 11.0}, {title: ‘Python', price: 9.0}]);

Barn

github.com/arokor/barn

Barn在localStorage之上提供了一个类似Redis的API。如果持久性很重要,那么你将需要这个库来保持数据状态,以防发生错误。

基本使用:

let barn = new Barn(localStorage);

// 原始类型
barn.set(‘name', ‘Amy');
let name = barn.get(‘name'); // Amy

// List
barn.lpush(‘names', ‘Amy');
barn.lpush(‘names', ‘James');
let name1 = barn.rpop(‘names'); // Amy
let name2 = barn.rpop(‘names'); // James

localForage

https://github.com/localForage/localForage

这个简单而快速的库将通过IndexedDB或WebSQL使用异步存储来改善Web的脱机体验。它类似于localStorage,但具有回调功能。

基本使用:

localforage.setItem(‘name', ‘Amy', function(error, value) {
 // Do something
});

localforage.getItem(‘name', function(error, value) {
 if (error) {
  console.log(‘an error occurs');
 } else {
  // Do something with the value
 }
});

很神奇的是它提供中文文档

crypt.io

https://github.com/jas-/crypt.io

crypt.io使用标准JavaScript加密库实现安全的浏览器存储。使用crypto.io时,有三个存储选项:sessionStorage,localStorage或cookie。

基本使用:

let storage = crypto;
let book = { title: ‘JavaScript', price: 13 };

storage.set(‘book', book, function(error, results) {
 if (error) {
  throw error;
 }
 
 // Do something
});

storage.get(‘book', function(error, results) {
 if (error) {
  throw error;
 }
 // Do something
});

你还知道其他本地存储库吗?为什么使用它?

到此这篇关于分享8个JavaScript库可更好地处理本地存储 的文章就介绍到这了,更多相关JavaScript 本地存储库内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木! 

Javascript 相关文章推荐
jQuery AJAX 调用WebService实现代码
Mar 24 Javascript
JavaScript 类的定义和引用 JavaScript高级培训 自定义对象
Apr 27 Javascript
JS 控件事件小结
Oct 31 Javascript
jquery toolbar与网页浮动工具条具体实现代码
Jan 12 Javascript
检测一个函数是否是JavaScript原生函数的小技巧
Mar 13 Javascript
JS基于面向对象实现的放烟花效果
May 07 Javascript
jquery模拟多级复选框效果的简单实例
Jun 08 Javascript
微信小程序 devtool隐藏的秘密
Jan 21 Javascript
详解基于webpack2.x的vue2.x的多页面站点
Aug 21 Javascript
Vue 开发音乐播放器之歌手页右侧快速入口功能
Aug 08 Javascript
vue 组件内获取actions的response方式
Nov 08 Javascript
Vue 实现登录界面验证码功能
Jan 03 Javascript
浅析我对JS延迟异步脚本的思考
Oct 12 #Javascript
Webpack5正式发布,有哪些新特性
Oct 12 #Javascript
如何利用 JS 脚本实现网页全自动秒杀抢购功能
Oct 12 #Javascript
移动端JS实现拖拽两种方法解析
Oct 12 #Javascript
JavaScript读取本地文件常用方法流程解析
Oct 12 #Javascript
vue实现移动端返回顶部
Oct 12 #Javascript
用JavaScript实现贪吃蛇游戏
Oct 23 #Javascript
You might like
关于时间计算的结总
2006/12/06 PHP
WordPress自定义时间显示格式
2015/03/27 PHP
PHP常用的小程序代码段
2015/11/14 PHP
简单谈谈PHP中的include、include_once、require以及require_once语句
2016/04/23 PHP
用JavaScript脚本实现Web页面信息交互
2006/10/11 Javascript
JS代码格式化和语法着色V2
2006/10/14 Javascript
google地图的路线实现代码
2009/08/20 Javascript
动态获取复选框checkbox选中个数的jquery代码
2013/06/25 Javascript
raphael.js绘制中国地图 地图绘制方法
2014/02/12 Javascript
Blocksit插件实现瀑布流数据无限( 异步)加载
2014/06/20 Javascript
angularJS中$apply()方法详解
2015/01/07 Javascript
javascript+HTML5的Canvas实现Lab单车动画效果
2015/08/07 Javascript
推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)
2015/12/13 Javascript
详解JavaScript UTC时间转换方法
2016/01/07 Javascript
第三章之Bootstrap 表格与按钮功能
2016/04/25 Javascript
javascript基本数据类型及类型检测常用方法小结
2016/12/14 Javascript
BootstrapTable refresh 方法使用实例简单介绍
2017/02/20 Javascript
ES5 ES6中Array对象去除重复项的方法总结
2017/04/27 Javascript
bootstrap+jQuery实现的动态进度条功能示例
2017/05/25 jQuery
基于input框覆盖掉数字英文的实例讲解
2017/07/21 Javascript
一文快速详解前端框架 Vue 最强大的功能
2019/05/21 Javascript
最简单的vue消息提示全局组件的方法
2019/06/16 Javascript
如何基于javascript实现贪吃蛇游戏
2020/02/09 Javascript
[01:18:35]DOTA2-DPC中国联赛 正赛 Elephant vs LBZS BO3 第一场 1月29日
2021/03/11 DOTA
Python编程中装饰器的使用示例解析
2016/06/20 Python
使用sklearn进行对数据标准化、归一化以及将数据还原的方法
2018/07/11 Python
Django实现学生管理系统
2019/02/26 Python
python实现百度OCR图片识别过程解析
2020/01/17 Python
对pytorch的函数中的group参数的作用介绍
2020/02/18 Python
python内打印变量之%和f的实例
2020/02/19 Python
Skyscanner阿联酋:全球领先的旅游搜索平台
2017/11/25 全球购物
工厂车间标语
2014/06/19 职场文书
2014年底工作总结
2014/12/15 职场文书
审美与表现自我评价
2015/03/09 职场文书
nginx配置文件使用环境变量的操作方法
2021/06/02 Servers
MongoDB连接数据库并创建数据等使用方法
2021/11/27 MongoDB