什么是 persistence.js
persistence.js 是一个基于浏览器的对象储存库，它使用 HTML5 Web SQL 数据库或 IndexedDB 进行数据储存，提供了强大的查询功能和一致的 API。
如何安装 persistence.js
你可以使用 npm 来安装 persistence.js，只需要在命令行输入：
npm install persistencejs
当然，你也可以在 HTML 文件中引入 persistence.js：
<script src="https://unpkg.com/persistencejs/dist/persistence.js"></script>
如何使用 persistence.js
连接数据库
使用 persistence.js 前，我们需要先连接数据库。连接数据库的方式取决于你要使用的数据库类型，目前支持 HTML5 Web SQL 数据库和 IndexedDB。
连接 Web SQL 数据库
persistence.store.websql.config(persistence, 'myDatabase', 'Test Database', 5 * 1024 * 1024); // 第一个参数是 persistence 对象，第二个参数是数据库名称，第三个参数是数据库描述，第四个参数是数据库大小
连接 IndexedDB
persistence.store.indexeddb.config(persistence, 'myDatabase', 'Test Database', 5 * 1024 * 1024); // 第一个参数是 persistence 对象，第二个参数是数据库名称，第三个参数是数据库描述，第四个参数是数据库大小
定义模型
在使用 persistence.js 的过程中，我们需要定义模型来描述我们需要储存的数据。模型是一个 JavaScript 类，它有一组属性来表述对象，并可以添加自定义方法。
const Car = persistence.define('Car', {
name: 'TEXT',
price: 'INT'
});在定义模型时，可以通过 restrict() 方法来设置模型的属性约束，例如：
-- -------------------- ---- -------
----- ---- - -------------------------- -
----- -------
---- -----
-------------
----- -
---------- --- -- -- -- ---
--------- ---- -- -----
--
---- -
---- ---- -- ---- ---
---- - -- ---- -
-
---查询数据
查询数据是 persistence.js 最强大的功能之一。
查询所有数据
Car.all().list((results) => {
console.log(results);
});条件查询
Car.all()
.filter('name', '=', 'BMW')
.order('price', true)
.list((cars) => {
console.log(cars);
});上面的代码意思是查询所有名字为 BMW 的汽车，并按照价格排序。
聚合函数
查询结果可以使用聚合函数来处理，例如求和、平均数等。
Car.all()
.filter('name', '=', 'BMW')
.avg('price', (avgPrice) => {
console.log(`The average price of BMW is ${avgPrice}`);
});保存数据
-- -------------------- ---- ------- ----- --- - --- ----- ----- ------ ------ ------ --- --------------------- -------------------- -- - ---------------- --------- ---
更新数据
Car.all()
.filter('name', '=', 'BMW')
.one((car) => {
car.price = 600000;
persistence.flush(() => {
console.log('Car updated!');
});
});删除数据
Car.all()
.filter('name', '=', 'BMW')
.destroyAll(() => {
console.log('Car deleted!');
});示例代码
下面是一个完整的示例代码，可以让你更好地理解 persistence.js 的使用方法：
-- -------------------- ---- -------
-------------------------------------------- ------------- ----- ---------- - - ---- - ------
----- --- - ------------------------- -
----- -------
------ -----
---
----- --- - --- -----
----- ------
------ ------
---
---------------------
-------------------- -- -
------------------------ -- -
---------------- --------
---------------------
---
---------
--------------- ---- ------
---------- -- -
--------- - -------
-------------------- -- -
---------------- -----------
---
---
---------
--------------- ---- ------
-------------- -- -
---------------- -----------
---
---结语
以上是 persistence.js 的一个简单教程。persistence.js 提供了强大的查询功能和一致的 API，很容易上手。在实际开发中，如果需要在浏览器中储存大量的数据，persistence.js 可以成为一个很好的选择。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedbfffb5cbfe1ea0611c66