返回
创建于
状态
公开

Fuse.js 简介

Fuse.js 是一个轻量级的、无依赖的 模糊搜索 (Fuzzy Search) JavaScript 库。

在传统的搜索中，通常要求输入与结果完全匹配（例如使用 indexOf 或正则表达式）。而 Fuse.js 允许用户在输入存在拼写错误、字符易位或不完整的情况下，依然能找到最相关的匹配项。

核心特性

  • 轻量化：没有任何外部依赖，体积非常小。
  • 模糊匹配：基于 Bitap 算法，支持设定“阈值”来控制模糊程度。
  • 多字段搜索：可以同时在对象的多个属性（如标题、描述、作者）中搜索。
  • 权重分配：支持为不同的搜索字段分配权重（Weight），让最重要的字段优先。
  • 搜索结果排序：根据得分（Score）自动对结果进行排序，最匹配的排在最前面。

基础代码示例

以下是如何在 JavaScript 中使用 Fuse.js 的简单示例：

javascript
1// 1. 定义搜索数据源
2const list = [
3  { title: "Old Man's War", author: "John Scalzi" },
4  { title: "The Lock Artist", author: "Steve Hamilton" },
5  { title: "HTML5", author: "Remy Sharp" }
6];
7
8// 2. 配置搜索选项
9const options = {
10  // 允许的匹配阈值 (0.0 完全匹配, 1.0 匹配任何内容)
11  threshold: 0.3,
12  // 指定搜索的字段
13  keys: ['title', 'author']
14};
15
16// 3. 初始化 Fuse
17const fuse = new Fuse(list, options);
18
19// 4. 执行搜索
20const pattern = "olman";
21const result = fuse.search(pattern);
22
23console.log(result);

关键配置项说明

配置项说明默认值
keys搜索的属性列表，支持嵌套路径（如 author.firstName）。[]
threshold模糊匹配的灵敏度。0.0 表示精确匹配，0.6 是默认的模糊度。0.6
includeScore是否在结果中包含匹配得分。false
shouldSort是否根据得分对搜索结果进行自动排序。true
location预期的匹配字符在字符串中的大概位置。0
distance匹配位置偏离 location 时的惩罚系数。100

适用场景

  1. 前端过滤列表：例如在个人博客、联系人列表或简单的商品目录中实现搜索。
  2. 输入补全 (Autocomplete)：提升用户在输入框搜索时的容错率。
  3. 静态网站搜索：对于没有后端数据库的静态页面，Fuse.js 是实现搜索功能的绝佳工具。

总结

Fuse.js 非常适合处理中小体量的数据搜索。如果你的数据量达到了数十万级别，或者需要全文索引功能，那么你可能需要转向 Elasticsearch 这种服务器端解决方案。但对于大多数 Web 应用的界面内搜索，Fuse.js 是一个兼顾性能与体验的“小而美”的选择。