js之客户端存储

概述

客户端存储
cookie
Storage
sessionStorage
localStorage
IndexedDB
打开
事务
游标
索引

主要包含

  • 名称
  • 路径
  • 过期时间
  • 安全标志

Storage

存储的主要方法有

  • clear()
  • setItem(name, value)
  • getItem(name)
  • removeItem(name)
  • key(index)

两个实例有

  • sessionStorage
  • localStorage

事件有

  • storage, 事件对象的属性有
    • domain
    • key
    • newValue
    • oldValue

IndexedDB

IndexedDB
IDBRequest
IDBDatabase
IDBCursor
IDBKeyRange
IDBIndex

打开:indexedDB.open(dbname, version),返回对象为IDBRequest,其支持事件onerroronsuccess,事件 对象属性有

  • event.target:为请求
  • event.target.result:为IDBDatabase
  • event.target.errorCode:错误码

如果数据库不存在,会触发事件upgradeneeded
IDBDatabase:其支持的属性和方法有

  • objectStoreNames
  • deleteObjectStore(table)
  • createObjectStore(table)

事务访问形式有,其支持的事件有onerror,oncomplete

  • db.transaction():对数据库的所有对象存储有只读权限
  • db.transaction(数组/字符串):对数据库的指定对象存储有只读权限

事务访问权限有

  • "readonly"
  • "readwrite"
  • "versionchange"

获取对象存储

javascript 复制代码
const store = transaction.objectStore(table);

对象存储支持的方法有,其返回的请求对象支持的事件有onerror,onsuccess

  • get(key)
  • add():有重复时会报错
  • put()
  • delete()

游标操作使用,其支持的事件有onerror,onsuccess,事件对象event.target.resultIDBCursor

javascript 复制代码
const request = store.openCursor();

IDBCursor的属性有

  • direction:值有NEXT("next"),NEXTUNIQUE("nextunique"),PREV("prev"),PREVUNIQUE("prevunique")
  • key
  • value
  • primaryKey

方法有

  • update()
  • delete()
  • continue()
  • advance(count)

游标打开时可以指定键范围使用IDBKeyRange,其支持的方法有

  • only():一个参数
  • lowerBound():第二个参数表示是否包含自身,false表示包含, true表示不包含
  • upperBound():第二个参数表示是否包含自身,false表示包含, true表示不包含
  • bound():下限的键,上限的键,是否跳过下限,是否跳过上限

索引创建

javascript 复制代码
const index = store.createIndex("username", "username", {unqiue : true});

获取索引

javascript 复制代码
const index = store.index("username");

索引游标操作,其事件result.key为索引键

javascript 复制代码
const reqeust = index.openCursor();
const reqeust = index.openKeyCursor();//result.key为索引键,result.value为主键

索引查询

javascript 复制代码
const request = index.get("008");//获取单条记录
const request = index.getKey("008");//result.value为主键

IDBIndex的属性有

  • name
  • keyPath
  • objectStore
  • unique

objectStore对象存储中有属性indexNames

删除索引使用

javascript 复制代码
store.deleteIndex("username");
相关推荐
Nontee5 小时前
MySQL 插入冲突了怎么办?两种处理方式入门笔记
数据库·笔记·mysql
单线程_015 小时前
从案例分析 Vue3 Tokenizer 源码一
前端·javascript·vue.js
ltl5 小时前
Parquet 文件格式:row group、编码与谓词下推索引
数据库
ltl5 小时前
PostgreSQL Join 路径:优化器如何选中 Nested Loop
数据库
ltl6 小时前
RocksDB 生产嵌入:Flink、TiKV 与 Kafka Streams 怎么用
数据库
大模型码小白6 小时前
AI 对话流性能调优:万级消息的虚拟滚动落地
java·大数据·前端·javascript·人工智能·算法·机器学习
m0_547486666 小时前
《JavaScript核心原理 》全套PPT课件2026
开发语言·javascript·ecmascript
xm_xm_xm_17 小时前
react17版本以前类组件常用操作
前端·javascript·react.js
devilnumber7 小时前
MySQL 性能优化・诗意化记忆
数据库·mysql·性能优化
瀚高PG实验室7 小时前
PostgreSQL pg_basebackup 和 pg_rewind 可覆盖源端超级用户选择的无关文件HGVE-2026-E010
数据库·postgresql·瀚高数据库