localforage的介绍与使用

简介

localForage 是一个 JavaScript 库，通过简单类似 localStorage API 的异步存储来改进你的 Web 应用程序的离线体验。它能存储多种类型的数据，而不仅仅是字符串。

github链接：https://github.com/xmoyking/localForage-cn (opens new window)

api文档：https://localforage.docschina.org/#api-getitem (opens new window)

基于：浏览器数据库IndexedDB (opens new window)或 WebSQL(已于2010年9月18日起弃用)实现的

对比localStorage

相同：api使用大致相同，getItem，setItem，removeItem...

不同：

• localStorage存储的值是字符串，localforage支持多种数据类型
• 异步，不会阻塞
• 储存空间大 ，IndexedDB 的储存空间比 LocalStorage（浏览器不同：2.5MB 到 10MB 之间）大得多，一般来说不少于 250MB，甚至没有上限。

基本使用

getItem(key, successCallback) 从仓库中获取 key 对应的值并将结果提供给回调函数。如果 key 不存在，getItem() 将返回 null。

localforage.getItem('somekey', function(err, value) {
    // 当离线仓库中的值被载入时，此处代码运行
    console.log(value);
})

setItem(key, value,successCallback) 将数据保存到离线仓库

localforage.setItem('somekey', function(err, value) {
    console.log(value);
})

removeItem(key, successCallback) 从离线仓库中删除 key 对应的值。

localforage.removeItem('somekey', function() {
    console.log(value);
})

clear(successCallback) 会删除离线仓库中的所有值。谨慎使用此方法！！！

localforage.clear(function() {
    console.log('清空所有');
})

length(successCallback) 获取离线仓库中的 key 的数量（即数据仓库的“长度”）。

localforage.length().then(function (numberOfKeys) {
    console.log("a-key数量为", numberOfKeys);
})

createInstance({ name: "" })创建并返回一个localforage的新实例。每个实例对象都有独立的数据库，而不会影响到其他实例。

const aLf = localforage.createInstance({ name: "a" });