您的位置:

fuse.js——功能强大易用的JavaScript模糊搜索库

随着网络和软件技术的发展,搜索功能已经成为现代Web开发中必不可少的功能之一。而模糊搜索在搜索需求中日益普及,因此,实现一个高效、准确的模糊搜索系统成了很多开发者的追求。

一、概述

fuse.js是一种JavaScript搜索库,它可以在内存中存储多个文档并允许使用模糊搜索、所有权搜索、逐字搜索等多种算法进行搜索。它提供高度自定义的搜索方法,包括搜索条目的选项、搜索权重和结果排序方式等。

该搜索库提供了两种算法—一种基于“布尔逻辑”,另一种则是Fuzzy逻辑,也就是模糊搜索逻辑。除此之外,fuse.js还提供了一种"simpleIndex"算法,用于快速处理主要文本块的高速搜索、爬虫支持、加权搜索和时间限制等功能。

二、快速上手

安装fuse.js非常容易,只需要使用npm即可进行安装,如下所示:

npm install fuse.js

添加此库后,可以通过调用Fuse构造函数来创建一个Fuse对象:

const Fuse = require('fuse.js');

const books = [{
  title: "Old Man's War",
  author: {
    firstName: 'John',
    lastName: 'Scalzi'
  }
}, {
  title: 'The Lock Artist',
  author: {
    firstName: 'Steve',
    lastName: 'Hamilton'
  }
}];

const options = {
  keys: ['title', 'author.firstName']
};

const fuse = new Fuse(books, options);

如上所示,提供了options参数,它允许我们根据我们要搜索的键列表来自定义Fuse配置。此外,在构造函数中还可以设置其他各种选项,包括搜索范围等。

构建Fuse对象之后,您可以通过调用Fuse实例的search方法来使用它来进行搜索,如下所示:

const result = fuse.search('old');
console.log(result);

此代码将输出一个包含模糊搜索结果的数组。如果未找到结果,则该数组将为空。

三、使用Fuse.js的更高级技巧

1、在对象数组中搜索

Fuse.js的一个重要功能是可以对对象数组进行搜索。通过keys参数,可以指定要搜索的对象属性,如下所示:

const products = [{
  name: 'Coca-Cola',
  manufacturer: 'The Coca-Cola Company',
  department: 'Beverages'
}, {
  name: 'Pepsi-Cola',
  manufacturer: 'PepsiCo, Inc.',
  department: 'Beverages'
}, {
  name: 'Campbell Soup',
  manufacturer: 'Campbell Soup Company',
  department: 'Food'
}];

const options = {
  keys: ['name', 'manufacturer', 'department']
};

const fuse = new Fuse(products, options);
const result = fuse.search('campbell');

此代码将通过使用Fuse搜索所有包含“餐厅”(“campbell”是其部分字符串)的物品的数组。它搜索名称、制造商和部门这三个键。

2、自定义搜索结果

Fuse.js允许我们自定义返回结果。如果我们要执行非常特定的搜索并生成一组自定义结果,则可以通过几种方法实现它。这里我们给出一种非常简单的自定义搜索结果方法:

const options = {
  getFn: (obj, path) => {
    if (path.length === 1) {
      return obj[path[0]];
    }
    return path.reduce((prev, curr) => {
      return prev && prev[curr];
    }, obj);
  }
};

const fuse = new Fuse(products, {
  keys: ['name', 'manufacturer', 'department'],
  ...options
});

const result = fuse.search('pepsi').map(item => item.item);
console.log(result);

在这个例子中,我们传递了一个名为getFn的函数参数。它是Fuse提供的一种回调函数,它允许我们在Fuse内部搜索并在结果集中返回自定义内容。

3、使用LocaleStringCollator进行本地化排序

除了基于键的排序(默认情况下),Fuse.js还支持使用给定区域设置的可以排序。如果要启用这项功能,必须安装Intl对象的Polyfill。

如下所示:

const Fuse = require('fuse.js');
const Intl = require('intl'); 

require('intl/locale-data/jsonp/en.js'); // English
require('intl/locale-data/jsonp/de.js'); // German

const data = [
  { name: 'John Smith' },
  { name: 'Joana Smith' }
];

const options = {
  keys: ['name'],
  includeScore: true,
  threshold: 0.6,
  location: 0,
  distance: 30,
  shouldSort: true,
  caseSensitive: false,
  useExtendedSearch: false,
  ignoreLocation: false,
  findAllMatches: false,
  id: null,
  getFn: null,
  sortFn: new Intl.Collator('en').compare,
  tokenize: false,
  matchAllTokens: false,
  keysMultidimensional: false,
  stringify: true,
  searchFn: null,
  sort: true,
}

const fuse = new Fuse(data, options);
const result = fuse.search('Joana');

console.log(result); // [{ name: 'Joana Smith', score: 0.125 }]

如上所示,我们使用了一个新的选项项:“sortFn”。该函数基于提供的区域语言设置对结果进行排序。这是一种非常有用的功能,因为在一些语言中,按字母顺序排序并不是唯一的最佳排序顺序。例如,在德语中,与“ß”相似的字母Z在字母表中排在最后。

四、总结

在本文中,我们介绍了一款强大的JavaScript模糊搜索库——fuse.js。通过阅读本文,您可以学习如何快速开始使用Fuse对象对对象搜索和文本搜索进行模糊搜索。Fuse.js还提供其他高级搜索技巧,如自定义搜索结果、使用本地化排序等多项功能。如果您正在构建一个需要优秀搜索功能的应用程序,这款搜索库将会是您的一个很好的选择。