前端实现搜索排序

筛选数组

filter函数,里面检测的是下面的函数

const showGraph=allGraph.filter(item=>{
                // if(item.cnName){
                //     return reg.test(item.name)||reg.test(item.cnName)
                // }else{
                //     return reg.test(item.name)
                // }

                console.log(item.name.indexOf(debounceValue),item.name)
                return item.name.indexOf(debounceValue)>=0
            })

1 .正则 reg.test(str):正则匹配到对应字符串就是true.
2 .indexOf(str,idx)方法:查找指定字符串第一次出现的位置，如果没找到匹配的字符串则返回 -1.从前面出现,lastIndexOf最后从后面加
3 .split:拿被检索的字符串来切割已有的字符串,如果能够切割,说明里面有字串,就是可以搜索的,如果不能切割,最后返回还是原来的字符串

"50050".split('50')=['',0,'']

4 .str.match(reg):返回匹配就是true.但是match方法比test慢多了

item.name.match(debounceValue)!==null

对筛选的数组进行排序

1 .拿数组里面的某一项进行排序
2 .localeCompare():返回一个数字来指示一个参考字符串是否在排序顺序前面或之后或与给定字符串相同。

showGraph.sort((a,b)=>{
                //默认是按照字符串排序的,使用里面的函数对他修正 

                // if(a.name<b.name){
                //     return -1
                // }else if(a.name>b.name){
                //     return 1
                // }return 0
//上面这种更加适合用来比较数字,虽然我们的编号是数字

                return a.name.localeCompare(b.name)
//比较字符串
var x = a.type.toLowerCase();
      var y = b.type.toLowerCase();
      if (x < y) {return -1;}
      if (x > y) {return 1;}
      return 0;
//或者要这样操作下
            })