Neovictorian Paisley Menswear

    namedstorage

    1.1.0 • Public • Published

    Build Status Coverage Status NPM Version dependencies Status devDependencies Status

    Sauce Test Status

    NamedStorage

    更高效的使用 localStoragesessionStorage

    下文统一使用 WebStorage 来表示 localStoragesessionStorage

    下载

    使用 NPM 安装:

    npm install namedstorage
    

    或者直接下载: https://unpkg.com/namedstorage/namedstorage.min.js

    特点及使用示例

    JSON 友好

    读取与存储的都是 JSON 数据, 这意味着你能保留数据类型:

    const ls = new NamedStorage()
    ls.set('key', 1)
    typeof ls.get('key') // "number"

    命名空间

    初始化 NamedStorage 实例时, 你可以提供一个命名空间(NamedStorage 默认提供了一个命名空间——"d", 即 default 的首字母), 则对此实例的所有增删改查操作都会以这个命名空间作为前缀, 这能有效的避免冲突:

    const foo = new NamedStorage('foo')
    const bar = new NamedStorage('bar')
    foo.set('bar', 1)
    bar.set('bar', 2)
    localStorage.getItem('bar') // null
    localStorage.getItem('foo:bar') // "1"
    localStorage.getItem('bar:bar') // "2"
     

    相同的存储空间与命名空间会得到同一个实例:

    const ss1 = new NamedStorage({ name: 'foo', session: true, cache: false })
    const ss2 = new NamedStorage({ name: 'foo', session: true, cache: true }) // 因为是同一个实例, 所以重新定义 `cache` 与 `lazySave` 配置不会生效
    ss1 === ss2 // true
     
    const ls = new NamedStorage('foo')
    ls === ss1 // false

    因为有了命名空间的支持, 所以清空此实例的数据时可以选择只清空此命名空间内的数据, 而不是清空整个 WebStorage。

    const ls = new NamedStorage('foo')
    ls.set('bar', 1)
    localStorage.getItem('foo:bar') // '1'
    localStorage.setItem('bar', '2')
     
    ls.clear()
    ls.get('bar') // undefined
    localStorage.getItem('foo:bar') // null
    localStorage.getItem('bar') // '2'
     
    ls.clear(true)
    localStorage.getItem('bar') // null

    缓存数据

    相比起每次读取数据时都从 WebStorage 内读取, NamedStorage 能缓存第一次读取的值, 并在后面读取时直接使用缓存值。

    API

    new NamedStorage(name)

    name (String)

    等同于 new NamedStorage({ name: name })

    new NamedStorage([options])

    options.session (Boolean)

    默认情况下使用 localStorage。设置此项为 true 则使用 sessionStorage

    options.name (String)

    此实例的命名空间, 默认为 "d"。详情见命名空间

    const ls = new NamedStorage({ name: 'hello' })
    ls.namespace // 'hello:' -> 后面多了一个冒号

    options.cache (Boolean)

    默认值为 true。设为 false 可禁用缓存功能。详情见缓存数据

    方法

    NamedStorage.prototype.set(key[, value])

    设置数据。如果 valuenullundefined 则删除这个数据。

    NamedStorage.prototype.get(key)

    获取数据。

    NamedStorage.prototype.remove(key)

    删除数据。

    NamedStorage.prototype.clear(whole)

    默认情况下, 这个方法只会删除当前命名空间内的数据, 但如果指定 wholetrue, 则会删除整个 WebStorage 内的数据。详情见命名空间

    属性

    不要去更改这些属性的值, 你应该把这些属性都视为只读的。

    this.type (String)

    'local''session', 取决于你传入的 options.session 参数。

    this.storage

    当前实例指向的存储空间, localStoragesessionStorage

    this.useCache (Boolean)

    当前实例是否启用了缓存功能。

    this.caches (Object)

    缓存的数据。如果没有启用缓存功能, 则此属性的值是 undefined

    this.namespace (String)

    当前实例的命名空间。

    陷阱

    NamedStorage 提供了一个默认的命名空间——"d"

    如果你不自定义 name 的话, 你每次得到的都是同一个实例:

    const s1 = new NamedStorage({ cache: false })
    const s2 = new NamedStorage({ cache: true })
    s1 === s2 // true
    s2.namespace === 'd:' // true
    s2.useCache // false

    如果你启用了缓存, 则直接更改 WebStorage 内的值不会反映到 NamedStorage

    const ls = new NamedStorage()
    ls.set('foo', 'bar')
    localStorage.getItem('d:foo') // 'bar
     
    localStorage.setItem('d:foo', 'changed')
    ls.get('foo') // 'bar'

    推荐统一使用 NamedStorage 操作存储空间。

    许可

    MIT

    Keywords

    none

    Install

    npm i namedstorage

    DownloadsWeekly Downloads

    0

    Version

    1.1.0

    License

    MIT

    Last publish

    Collaborators

    • milklee