资讯专栏INFORMATION COLUMN

上云采购季！| 爆款云服务器低至4.6元/月，首单享0.9折

免费试用
首页/文章专栏/Local Storage 操作小插件 iStorage 介绍

Local Storage 操作小插件 iStorage 介绍

ky0ncheng / 2116人阅读

摘要：介绍是针对浏览器的一个便捷操作插件。也是作者的第一个插件，不足之处还请见谅和指正。安装使用支持操作。详见此版本改动较大，涉及方法名称的语义化，新方法的添加，方法废弃，新增本地调试代码，信息进一步优化。

iStorage 
Local Storage 是 HTML 5 新增的一个本地存储 API，所谓 Local Storage 就是一个小仓库的意思，它有 5 M 的大小空间，存储在浏览器中，我们可以通过 JavaScript 来操纵 Local Storage。
iStorage 介绍

iStorage是针对浏览器 Local Storage 的一个便捷操作插件。它支持用户直接存储和获取数字(非 NaN)、字符串、数组、JSON 类型数据。

iStorage 是基于原生 JavaScript 实现的，它编译压缩后仅 2kb 左右，请放心试用。也是作者的第一个 NPM 插件，不足之处还请见谅和指正。

iStorage 安装

iStorage 支持 CommonJS RequireJS iStorage 使用

iStorage 支持 getLength getIndex getItem setItem removeItem clearAll 操作。debug 尾参数可选，用于在控制台打印操作详情日志。

// 获取 Local Storage Length
iStorage.getLength(debug: Boolean);

// 根据 Local Storage 的长度（length）作为索引值，来获取键名
iStorage.getIndex(index：Number, debug: Boolean);

// 依据键名获取值
iStorage.getItem(key: String, debug: Boolean);

// 添加键值对,值类型允许长度为0
iStorage.setItem(key:String, value:!NaN || Number || String || Array || JSON, debug:Boolean)

// 删除键值对
iStorage.removeItem(key: String, debug: Boolean);

// 清楚该域的所有Local Storage 记录
iStorage.clearAll(key: String, debug: Boolean);
iStorage 本地测试 
// 请先fork,下载到本地后命令行初始化开发调试环境：
> npm i // 安装 uglify-js 用于压缩生产
> npm test // webpack-dev-server open: http://localhost:9000/

// 若要修改插件,比如 0.0.3 版，请参考以下指令
// 修改未压缩版本 iStorage.js, 修改完后，使用 uglify-js 压缩
> uglifyjs iStorage.js  -m -c -o iStorage.min.js
iStorage 未来

使用 TypeScript 重构，添加 sessionStorage 和 cookie，并希望支持异步操作.

iStorage 更新日志 0.0.1

第一版代码比较粗糙，仅用于验证代码结构和方法的设计、插件的实际用途。基本实现了数字、字符串、数组、JSON 对象四种基本数据的类型检测，直接存储和获取;方法上实现了:

check: 检查某个键名是否存在

get：获取某个键名的值

set：设置键值对

remove：根据键名删除某个键值对

详见 redeme@0.0.1

0.0.2

该版本在代码上进行了完善，并提供了更好 debug log 信息。

详见 redeme@0.0.2

0.0.3

此版本改动较大，涉及方法名称的语义化，新方法的添加，check 方法废弃，新增本地 Webpack 调试代码，debug log 信息进一步优化。

GPU服务器 云服务器 如何介绍小程序 iStorage php操作doc插件 local

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/94252.html

相关文章

  • 给localStorage加上过期时间

    摘要：定时器时间到了就将中存的信息以及存的时间信息就是那个对象中的删掉就行了。难道存了三条我就做三个定时器存的条我就做个定时器这也太了而且也并不符合实际。 一、酷酷的开头 在潜水的时间长达一年之后，我终于鼓起勇气开始写我的第一篇文章了。前端小菜，只是想记录一下自己的想法，望各位看到这文的大佬轻喷。 在现在前后端分离的开发模式下，存储信息一般都不在使用以往使用的cookie了，就拿笔主我之前做...

    davidac 评论0 收藏0

  • chrome扩展应用开发快速科普

    摘要：扩展应用模块功能介绍扩展应用由很多部分组成，其中主要模块为为了避免由于翻译原因导致的问题，因此在下文中对相关模块的称呼一律采用上面的英文。附录官方开发文档英建议有英文阅读能力的人阅读此文档。 概述 本文通过对chrome插件的各个部分进行快速的介绍，从而让大家了解插件各个部分的关系，并且知道如何将其进行组装成一个完整的chrome插件。 由于chrome官方文档中对于如何从零开发一个c...

    MockingBird 评论0 收藏0

  • Chrome插件开发入门：如何实现一键上班赖皮

    摘要：老板查岗时，一个快捷键，立即关闭所有赖皮页面。上传，发布插件。从零开始，开发简单的一键赖皮插件的上班族都在使用浏览器赖皮，所以我们选择采用插件来实现功能。 很多人介绍过Chrome插件，但必须要说，插件开发就是摆弄一个小玩具，第一要素是实用，其次是好玩。 单纯罗列各种功能是非常无趣的。 所以把一篇旧文拿出来与大家分享。 人，活着就是为了赖皮。 作为一个合格的开发人员，把30%的时间用...

    acrazing 评论0 收藏0

  • 实现一个简单的chrome插件

    摘要：小结本文只是简单分享了如何开发一个简单的谷歌浏览器插件，以及一些注意事项，并且提到了如何授权和使用谷歌插件，重点介绍了插件开发必备的入口文件和插件中几个重要环境以及环境之间的通信。 我们在上网的时候，都会用到浏览器，但是浏览器并非拥有我们想要的所有功能，我们可以根据自己的需要，实现自己的插件来满足需求。比如网页中经常会有大量的广告，如果你希望拥有一个纯净的网页，可以实现一个插件来删除网...

    rubyshen 评论0 收藏0

  • 实现一个简单的chrome插件

    摘要：小结本文只是简单分享了如何开发一个简单的谷歌浏览器插件，以及一些注意事项，并且提到了如何授权和使用谷歌插件，重点介绍了插件开发必备的入口文件和插件中几个重要环境以及环境之间的通信。 我们在上网的时候，都会用到浏览器，但是浏览器并非拥有我们想要的所有功能，我们可以根据自己的需要，实现自己的插件来满足需求。比如网页中经常会有大量的广告，如果你希望拥有一个纯净的网页，可以实现一个插件来删除网...

    lieeps 评论0 收藏0

发表评论

登陆后可评论

0条评论

ky0ncheng

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<