Matrix

Appearance

Matrix ​

Matrix 是一个现代的 JavaScript 工具库，旨在提供简洁、高效、易用的工具函数。

Matrix 的命名灵感来源于矩阵（Matrix），矩阵是一个数学概念，用于表示多维空间中的点、向量和变换。Matrix 的命名也体现了其多维、灵活和强大的特性。

功能分类 ​

Matrix 的工具函数按照以下维度进行分类:

点击查看功能结构图Matrix功能结构图

Base 基础工具 ​

与业务无关的纯工具函数:

  • 不依赖特定环境
  • 高复用性
  • 基础能力支撑
  • 纯函数实现

DOM 操作 ​

浏览器 DOM 相关操作:

  • 元素操作和判断
  • 事件处理
  • 样式操作
  • 节点遍历

BOM 操作 ​

浏览器对象模型相关:

  • 存储管理
  • 设备信息
  • Cookie 信息
  • 环境检测

Format 格式化 ​

数据格式转换工具:

  • 数据格式转换
  • 展示格式处理
  • 单位换算
  • 标准化输出

Bridge 桥接层 ​

客户端通信相关:

  • 客户端通信
  • 协议处理
  • 数据转换
  • 状态同步

Business 业务工具 ​

特定业务场景工具:

  • 特定业务场景
  • 领域相关
  • 复合功能
  • 场景化解决方案

使用示例 ​

typescript
// NPM 方式引入
import { convertToCamelCase, isEmpty, debounce } from '@fu/matrix';

// UMD 方式引入
const { convertToCamelCase, isEmpty, debounce } = window.fuMatrix;

// 字符串转驼峰
convertToCamelCase({ user_name: 'John', email_address: 'john@example.com' }); 
// => { userName: 'John', emailAddress: 'john@example.com' }

// 检查空值
isEmpty(''); // => true
isEmpty([]); // => true
isEmpty({}); // => true

// 防抖函数
const debouncedFn = debounce(() => {
  console.log('执行防抖函数');
}, 300);

关于数组操作 ​

Matrix 专注于提供原生 JavaScript 没有的实用功能，对于数组操作建议直接使用原生方法：

typescript
// 推荐：直接使用原生数组方法
const filtered = [1, 2, 3, 4].filter(x => x > 2);
const found = [1, 2, 3, 4].find(x => x > 2);
const mapped = [1, 2, 3].map(x => x * 2);

特性 ​

  • 🚀 完全使用 TypeScript 编写，提供完整的类型定义
  • 📦 支持 Tree-shaking，按需打包
  • 🔧 模块化设计，功能分类清晰
  • 📱 支持多平台适配
  • 🛡️ 完整的单元测试覆盖
  • 📖 详细的文档和示例
  • ⚡ 零依赖，不重复造轮子

环境支持 ​

  • 现代浏览器 (ES6+)
  • Node.js 14+
  • 支持 ESM 和 UMD

文档导航 ​