如何改进我的backbone.js搜索功能

How to improve my backbone.js search Function?

本文关键字:搜索 功能 js backbone 何改进 我的      更新时间:2023-09-26

我有一个搜索功能作为我正在编写的骨干应用程序的一部分。我需要有人帮我把它展开。理想情况下,我希望它能够

  1. 在我的模型和
  2. 中搜索多个类别
  3. 不必是这样的精确匹配(也许使用RegEx?)

下面是我的代码:

search: function(e) {
           var search = this.$('.search').val();  //pulling in from the search bar
           results = namesCollection.filter(function(item) { return item.get('First_Name') == (search);}); //returns a filtered collection that matches (exactly) the search results
           filteredCollection.reset(results); //this just resets the current view
}

代码可以工作,但是现在它只返回对First_Name精确匹配的结果。有没有办法让它匹配First_Name和Last_Name?此外,我试图找到一种方法,让它返回不完整的搜索。因此,在搜索栏中输入' John ',将返回John和Johanna的First_Name。

我的数据是这样的(当然是简化的):

var data = [
            {
             "First_Name": "John",
             "Last_Name": Smith
            },
            {
             "First_Name": "Johanna",
             "Last_Name": "Greene"
            }
          ];

namesCollection引用数据集中所有名称的主干集合。谢谢!

至于搜索名字和姓氏,为什么不在过滤后的结果上运行另一个过滤器呢?你可以用空格分割搜索。

results = namesCollection.filter(function(item) { return item.get('First_Name') == (search.split(' ')[0]);});
if(search.split(' ').length > 1){
    results = namesCollection.filter(function(item) { return item.get('Last_Name') == (search.split(' ')[1]);});
}

为了找到一个相似的字符串,可能会与拼写错误的单词一起工作,你可能需要像Levenshtein函数这样的东西,它允许你计算两个字符串之间的相似性。然后,您可以根据自己的阈值确定是否将其视为匹配。这里是它的js库

如果你想做部分匹配,假设他们拼写正确,你可以先搜索完全匹配,如果找到一个使用它(让我们说的名字,这意味着只有一个元素后分割)。如果没有找到完全匹配,则尝试使用indexOf()进行部分匹配。如果您在名字上得到匹配,并且还有一个姓氏(意味着拆分中有多个元素),那么尝试对姓氏进行精确匹配。如果姓氏匹配失败,则执行部分匹配搜索。

我将利用lodash/underscore。让生活更轻松。你也许可以解构成原生js,但我觉得这更容易。

#!/usr/bin/env node
_ = require('lodash');
var search = 'john';
var data = [
    {
        "First_Name": "John",
        "Last_Name": "Smith"
    },
    {
        "First_Name": "Jessica",
        "Last_Name": "Greene"
    },
    {
        "First_Name": "Sam",
        "Last_Name": "Johnson"
    }
];
var re = new RegExp(search, 'i');
data = data.filter(function(model){
    var matched = false;
    _.each(_.values(model), function(val){  
        if ( re.test(val) ) {
            matched = true;
        }
    });
    return matched;
});
console.log(data);

输出:

[ { First_Name: 'John', Last_Name: 'Smith' },
  { First_Name: 'Sam', Last_Name: 'Johnson' } ]

要完成主干收集,您需要执行this.collection.filter,并对_.values(model.attributes, cb)使用model.attributes。假设它是一个平面物体

这当然会匹配对象中的任何值,我是在node中做的,但可以很容易地在主干/浏览器中运行。

我不太熟悉Backbone,但是如何将精确匹配更改为。indexof或。contains呢?这样它可以过滤,而你在键入关键字等关键字,你可以移动到一个更精确的匹配,更多的关键字你给…

这就是shuffle.js使用的系统。看看这个搜索是如何工作的,我想可能是你正在搜索的。

search: function(e) {
       var search = this.$('.search').val();  //pulling in from the search bar
       results = namesCollection.filter(function(item) { return item.get('First_Name').indexOf( search ) !== -1 }); //returns a filtered collection that matches (not exactly) the search results
       filteredCollection.reset(results); //this just resets the current view
}