首页 > 解决方案 > JS - 用 indexOf 比较两个数组

问题描述

我正在尝试构建一个文档搜索来解释单词片段和单词的不同顺序 - 例如,有人可能正在尝试查找该部分:

Level 6 Pathology

他们可能通过输入搜索

Pathology Level 6
Level 6 Path
6 path

我还想确保所有搜索词都在结果中,以便

 level 6 path

不会打开文档中包含“级别”的每个子标题。

为了满足这些要求,我将搜索输入字符串“level”“6”“path”组合成空格分隔字符串“level 6 path”、“6 level path”、“path 6 level”等的每个可能组合。

代码:

function search(){
            event.preventDefault();
            var results = [];
            var searchinput = document.getElementById("searchbar").value.toUpperCase().split((" "), 6);                
            var word = searchinput.join(" ");
            if (searchinput.length > 1){
                var searchinputExpanded = recurCombinations(searchinput.length, searchinput);
                searchinputExpanded.unshift(word);
            } else {
                var searchinputExpanded = searchinput;
            }
            var arrayofdivs = document.querySelectorAll(".collapsible");                
            var j, k, m;

            //Find every combination of the search input so that both
            //Level 6 Path and Path Level 6 will find Level 6 Pathology
            function recurCombinations(len, input){
                var i = 0;
                var l = len - 1;

                if(len === 1){
                    return;
                } else {
                    for(i; i < l; i++){
                        recurCombinations(l, input);
                        l % 2 ? input.swap(i, l) : input.swap(0,l); //even-odd check 
                        results.push(input.join(" ").toString());
                    }
                    recurCombinations(l, input);
                }
                return results.sort();
            }            

            //close any currently expanded divs
            for(m = 0; m < arrayofdivs.length; m++){                    
                arrayofdivs[m].style.backgroundColor = "#eee";
                arrayofdivs[m].style.color = "#2CB2FF";
                arrayofdivs[m].nextElementSibling.style.display = "none";
            }

            //expand any applicable results
            for(j = 0; j < arrayofdivs.length; j++){
                for(k = 0; k < searchinputExpanded.length; k++){                      

                    if(arrayofdivs[j].innerHTML.toUpperCase().indexOf(searchinputExpanded[k]) !== -1){                                                 

                        arrayofdivs[j].style.backgroundColor = "#555";
                        arrayofdivs[j].style.color = "#fff";
                        arrayofdivs[j].nextElementSibling.style.display = "block";
                        arrayofdivs[j].parentNode.style.display = "block";
                        document.getElementById("clearbutton").style.display = "block";                
                    }
                }
            }
        }           

我的这部分工作正常,但有些标题包含更多单词,搜索不考虑这一点

Medical Imaging Level 5

会被发现

Level 5 Medical

但不是

Level 5 Imaging

在这种情况下,我认为大多数人会搜索“影像 5 级”而不是“医学 5 级”

我尝试对可能的结果进行每种单词组合 - 基本上:

 everyCombinationOfEveryPossibleResult.indexOf(everyCombinationOfSearchInput(path level 6) !== -1)

但是之后!当一些可能的结果短语很长时,每个短语的可能性意味着它花费了太长时间(因此搜索输入上限为 6 个字符串)并且会导致浏览器崩溃。

任何帮助,将不胜感激。

标签: javascriptarraysstringsearchindexof

解决方案


如果我理解正确,您只想找到包含搜索词中所有单词的字符串,但您不希望搜索词的顺序很重要。在这种情况下,您可以执行以下操作:

function searchMyArray(arrayToSearch, searchTermsArray){
    return arrayToSearch.filter(function(title){
        return !searchTermsArray.some(function(word){
            return title.indexOf(word) == -1;
        });
    });
}

在示例中,arrayToSearch 应该是一个包含您要搜索的所有标题的数组,而 searchTermsArray 应该是您要搜索的搜索词的数组(如果搜索词以字符串形式出现,则可以很容易地用 String 方法把它分成一个数组split)。该函数返回包含所有搜索词的标题列表。

该功能通过过滤掉搜索词中的某些单词不在标题中的所有标题来工作。


推荐阅读