@ouyangzhigang/common

Note: 该 npm 类库是一个通用的前端 class 封装类库，主要用于将前端中不同领域的方向和技术实现进行整体抽象，提供了一种便捷的方式来处理前端开发的各个方面。每个类都被设计 为可以处理特定领域的问题，并且可以通过简单的配置来实现定制化需求的处理。该类库提供了一些通用的前端 class，如请求、验证、缓存等等。同时，它还提供了抽象不同领域的方向， 如数据可视化、前端组件、移动端开发等，提供统一的封装和接口，方便快捷的开发。

功能

该库提供了以下功能：

1. 封装通用的前端 class: 包括了一些通用的 class，如请求、验证、缓存等等，可以通过继承和配置快速实现具体功能的编写。

2. 抽象不同领域的方向: 可以通过该库实现不同领域的前端开发，如数据可视化、前端组件、移动端开发等，提供统一的封装和接口，方便快捷的开发。

3. 提供了定制化配置: 该库提供了一些通用的配置方法，可以实现不同场景的需求定制化。同时，用户可以通过继承和重写方法等方式，实现更加符合自身业务需求的定制化编写。

优势

该库有以下优势：

1. 功能丰富: 该库提供了丰富的 class 封装和接口，可以快速高效的实现前端开发。

2. 通用性强: 该库被设计为通用的前端 class 封装，可以应用于不同领域。

3. 高度可定制: 用户可以通过继承和配置方法，实现不同场景下的定制化需求。

示例代码

以下是一个示例代码的演示：

import { RequestService } from "@ouyangzhigang/common";

const requestService = new RequestService({
  baseURL: "https://api.example.com",
});

requestService.get("/users").then((response) => {
  // 处理请求返回数据
});

安装

支持使用 npm 或者 yarn 进行安装:

npm install @ouyangzhigang/common --save

# 或者

pnpm add @ouyangzhigang/common --save

文档

IndexDb

随着浏览器的功能不断增强，越来越多的网站开始考虑将大量的数据存储在客户端，相比后端接口，获取数据更快一些。现有的浏览器存储方案都不适合存储大量的数据。Cookie 的大小不超过 4KB，而且每次请求都会发送到服务器，LocalStorage 在 2.5 ～ 10MB 直接，浏览器不同，存储的大小还不一样，而且不提供搜索功能，也不能建立自定义索引，webSQL 大家可以课外了解一下，因为 Web SQL Database 规范已经被废弃，官方文档也解释的很清楚，webSQL 规范底层采用 SQLite 的 SQL 方言，而作为一个标准，这是不可接受的，每个浏览器都有自己的实现以后就很能统一标准了，就像 IE 一样。最后，也是最重要的一个客户端存储大量数据的方案：IndexedDB。

==为了简化 indexDb 操作，本类库基于 webIndexDb API 封装和继承 Dexie 强化了此类库功能==

import

import { IndexDb } from '@ouyangzhigang/common'

create

// create database
const DB = new IndexDb({ databaseName: location.origin, version: 1 });
// create table
DB.version(1).stores({
  test: `++id, name, text`,
});

useage

if (!DB.test) {
  DB.test.add({
    name: "hello",
    text: "world!",
  });

  DB.test.add({
    name: "hehe",
    text: "How much is this shirt?",
  });
}

function put() {
  DB.test.put({
    id: 3,
    name: "Banana",
    text: "Anna is good math teacher!",
  });
}

async function get() {
  const res = await DB.test.get(1);
  console.log(res);
}
const dbPut = document.querySelector("#db_put");
const dbGet = document.querySelector("#db_get");

dbPut.onclick = () => put();
dbGet.onclick = () => get();

[文档参考与鸣谢] Dexie 官网 实战操作 indexDb 封装

Storage

storage 是浏览器一种简单键值对存储，只接受接受字符值，在存储过程中需要对数据进行字符转化，本类库基于 sessionStorage 和 localStorage API 对其操作进行了封装和简化，并集成加密特性避免数据泄露

了解更多有关该类库的详细信息，请查阅API 文档。

贡献

如果您有任何贡献或建议，请在该库的 Github 仓库上提出Issue，或者直接提出Pull Request。我们非常欢迎您的贡献和参与！

协议

该类库基于 MIT 协议发布。请仔细阅读LICS，以便了解有关使用该类库的条款和条件。