indexedDB的基础使用--索引

最新推荐文章于 2023-09-13 18:01:24 发布
最新推荐文章于 2023-09-13 18:01:24 发布
阅读量1.8k 收藏 1
点赞数
分类专栏： 前端 数据库系统 文章标签： indexedDB 索引 数据库
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hjc256/article/details/89008239
版权

文章目录


根据MDN文档的描述，索引是一种为了在其他 objectStore中查找数据的 objectStore。用户可以使用这个接口来获取数据。

用户可以通过主键或者是索引来获取数据。索引可以让你使用记录中的值而不是主键来查找数据。

数组是一个长期有效的键-值存储，它的值就是被参照的objectStore的键。无论什么时候数据在被参照objectStoe中被插入、更新或删除，索引中的数据是自动产生的。索引中的每一条数据
都只能指向被参照objectStore中的一条数据，但是几条数据可以同时指向被参照objectStore中的同一条数据。

索引的创建

创建索引需要用到IDBObjectStore对象的createIndex方法，需要注意这个方法只能在VersionChange事件回调中调用。

createIndex的用法

用法如下：

let index = objectStore.createIndex(indexName, keyPat
最低0.47元/天 解锁文章
Meskjei
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
indexeddb-promise:使用Promise封装IndexedDB
05-19
indexeddb-promise IndexedDB的所有操作都是异步的，API都是在回调函数中执行的，为了便于对其进行操作，使用ES6中的Promise来封装。 1. 安装 npm包 // use npm npm install --save-dev indexeddb-promise // use yarn yarn add --dev indexeddb-promise script引入 IndexedDB 会被注册为一个全局变量。建议链接到一个可以手动更新的指定版本号： [removed][removed] 2. 使用 import IndexedDB from 'indexeddb-promise' const db = new Ind
indexedDB（一）简介以及创建
qq_38935512的博客
09-25 1483
简介 indexedDB 1.前端浏览器本地基于javascript的事务性数据库,相比其他的浏览器缓存LocalStorage 、cookie等相比，数据有以下特点 1.存储量大，理论上不封顶 2.同源策略是一样的 3.多数api采用的都是异步的方式，防止数据量大的时候阻塞其他的一些操作 4.通过对象仓库存储的方式 5.存储的类型比较丰富 6.能够为数据建立索引，提供查找性能 2.IndexedDB的特点 1.对象仓库，在indexedDB中是没有表的概念的，而是objectStore，一个数据库中
indexDB入门到精通
weixin_53841730的博客
08-22 887
前言由于开发3D可视化项目经常用到模型，而一个模型通常是几m甚至是几十m的大小对于一般的服务器来讲加载速度真的十分的慢，为了解决这个加载速度的问题，我想到了几个本地存储的。首先是cookie,cookie肯定是不行的，因为最多以只能存4k，其次localStorage，最多能存5m(不是一个key的大小，是所有key的总大小最多加起来最多5m)，相对于cookie已经打了很多了。但是当遇到大模型还是不够，实际开发中大部分模型都是10m-30m的。
前端数据库indexedDB入门
前端小记
06-29 1万+
indexDB是HTML5的新概念，indexedDB是一个用于在浏览器中存储较大数据结构的Web API，并且提供了索引功能以实现高性能查找。
indexDB的理解与使用
Mosum的博客
05-29 8223
indexDB的理解与使用 indexDB的理解与使用 创建数据库 创建对象仓库 创建事务 操作数据 添加数据 获取数据 删除数据 使用游标 索引 创建索引 使用索引 实践 创建数据库 const request = indexedDB.open('myDatabase', 1); request.addEventListener('success', e =&gt...
IndexedDB（二：索引）
weixin_34295316的博客
12-09 164
在HTML5本地存储——IndexedDB（一：基本使用）中介绍了关于IndexedDB的基本使用方法，很不过瘾，这篇我们来看看indexedDB的杀器——索引。 熟悉数据库的同学都知道索引的一个好处就是可以迅速定位数据，提高搜索速度，在indexedDB中有两种索引，一种是自增长的int值，一种是keyPath：自己指定索引列，我们重点来看看keyPath方式的索引使用. 创建索引 我们可以在创...
ngx-indexed-db:将IndexedDB数据库包装在Angular服务中的服务。 它公开了非常简单的Observables API，以启用IndexedDB的使用，而无需进行过多的操作
04-08
ngx-indexed-db ngx-indexed-db是一项服务，结合了ngx-indexed-db ，将IndexedDB数据库包装在Angular服务中。安装$ npm install ngx-indexed-db或者$ yarn add ngx-indexed-db用法导入NgxIndexedDBModule并启动它： ...
indexeddb-vdba-driver:IndexedDB VDBA 驱动程序
07-04
indexeddb-vdba-驱动程序VDBA (Valencia Database API) 是 JavaScript 语言的异步 API，程序员可以使用它来访问数据库等数据。 VDBA 哲学类似于Node.js API。 indexeddb-vdba-driver是用于浏览器的IndexedDB驱动程序...
minimum-indexed-db：对本机IndexedDB的最小包装
02-04
npm i minimal-indexed-db如果需要的话， npm i minimal-indexed-db使用--save-dev npm i minimal-indexed-db 用法 该数据库是要实例化的，然后就可以使用了。 请注意，如果不存在，它将创建一个数据库。 由于...
indexeddb-treo-presentation:IndexedDB 和 Treo 包装库简介
07-11
带有 Treo 的 IndexedDB 演示文稿，使用 构建 在本地查看幻灯片 首先，确保您安装了以下内容： : $ npm install -g bower ： $ npm install -g gulp 然后，安装依赖项并运行预览服务器： $ npm install && ...
indexedDB复合索引
qq_42894622的博客
05-05 1062
目的：通过构建聚合索引，根据其中一个索引值匹配另一个索引值（不会对indexedDB数据进行深拷贝，只获取索引的值），提供性能优化 // index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta nam
indexDB入门到精通，indexdb增删查改，封装indexdb类库，indexdb基本使用
热门推荐
淋雨一直走~
11-29 3万+
indexdb入门操作指南，indexdb入门到精通，indexdb封装类库，indexdb的基本使用，超大容量的存储indexdb简单使用，web端的数据库，web端的大容量存储，优化浏览器加载资源速度。
15分钟，带你了解indexedDB，这个前端存储方案很重要！
程序员成长指北
07-07 1043
大厂技术高级前端Node进阶点击上方程序员成长指北，关注公众号回复1，加入高级Node交流群关于文本作者：Django强哥原文：https://juejin.cn/post/6995112265766666247最近在给前端班授课，在这次之前的最后一次课已经是在2年前，2年的时间，前端的变化很大，也是时候要更新课件了。整理客户端存储篇章时模糊记得HTML5是有形成标准的数据库，但是当年好...
谈谈前端的本地存储indexedDB
Amelian的博客
09-13 868
IndexedDB 是一个用于在浏览器中存储大量数据结构的Web API，是浏览器提供的本地数据库，可以被网页脚本创建和操作，允许存储大量数据，用于在客户端存储大量的结构化数据（也包括文件/二进制大型对象），提供查找接口，能建立索引。且IndexedDB 不同于其他SQL的关系型数据库，IndexedDB 是一个事务型的数据库系统，会将数据集作为个体对象存储，数据形式使用的是JSON，而不是列数固定的表格来存储数据的。
indexedDB数据库创建
09-04 286
1、首先需要使用使用indexedDB.open()方法，打开数据库 2、通过createObjectStore方法创建表， 创建表之后， 这个表通过createIndex方法创建索引 3、通过transaction方法创建事务，新建事务以后，通过IDBTransaction.objectStore(name)方法，拿到事务对...
前端新手必读：IndexedDB全面指北
dlcxycg的博客
08-13 555
IndexedDB是一种在浏览器中使用的客户端数据库，它提供了一种存储和检索大量结构化数据的方式。它是一种NoSQL数据库，采用键值对存储模型，可以存储任意类型的数据，包括对象、数组等。IndexedDB的特点之一是它支持事务操作，这意味着可以在一个原子操作中执行多个数据库操作，保证数据的一致性。此外，IndexedDB还支持索引，可以通过索引进行高效的数据查询。IndexedDB作为一种在浏览器中使用的客户端数据库，具有重要性和优势，适用于现代Web开发中的数据存储和检索需求。
Indexeddb 创建、增删改查
然后他就拿棍子来打我
10-18 6192
虽然小伙伴平时项目用到的不多，但了解它并会使用还是很有必要。以下是本人总结 IndexedDB 的常规使用方式. 2. 打开数据库 3. 监听 IndexedDB 版本更新 新建数据库时，新增数据表。 更新数据库时，对数据表进行更新。 效果图如下 效果图如下 效果图如下 效果图如下 效果图如下
本地数据库IndexedDB - 初学者
觉醒法师的专栏
10-18 1476
IndexedDB 是一种可以让你在用户的浏览器内持久化存储数据的方法。IndexedDB 为生成 Web Application 提供了丰富的查询能力，使我们的应用在在线和离线时都可以正常工作。
前端本地储存数据库 IndexedDB 零基础入门知识详解
starry-sea1412的博客
06-04 2013
IndexedDB 是一种在浏览器端存储大量结构化数据的 API。它是 HTML5 标准中的一部分，和 Web SQL Database 和 localStorage 类似都是浏览器端本地数据存储技术。由于 IndexedDB 的功能非常强大，所以学习和使用 IndexedDB 需要对浏览器端存储技术、JavaScript 异步编程、数据库设计和查询等方面都有深入了解。
vue-indexeddb
最新发布
09-19
vue-indexeddb是一个用于在Vue.js应用中使用IndexedDB的插件。IndexedDB是一种浏览器内置的数据库，可以在前端进行数据存储和检索操作。使用vue-indexeddb插件，你可以方便地在Vue.js应用中进行IndexedDB的操作，包括创建数据库、创建对象仓库（类似于表）、进行增删改查等。 在使用vue-indexeddb的时候，你需要在Vue实例的配置中指定使用的IndexedDB数据库名称和模式，并在需要使用IndexedDB的组件中引入并使用该插件提供的API进行数据库操作。 下面是一个使用vue-indexeddb的简单示例代码： ```javascript import Vue from 'vue' import VueIndexedDB from 'vue-indexeddb' Vue.use(VueIndexedDB, { version: 1, // 数据库版本号 database: 'test', // 数据库名称 schemas: [ // 数据库模式（对象仓库） { test: 'id, title, created_at, updated_at' }, { posts: 'id, owner' } ] }) new Vue({ el: '#app', render: h => h(App) }) ``` 以上代码中，使用了Vue.use方法来安装vue-indexeddb插件，并在配置中指定了数据库版本号、数据库名称和模式（对象仓库）。然后在Vue实例的配置中引入了vue-indexeddb插件，并在组件中使用插件提供的API进行数据库操作。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值