前言
通常情况后端返回的数组如果是英文的都是按照abcd这种方式进行排序,此时一般我们自己写或者组件自带的排序算法都是模糊排序,即输入B,会出现B***, **B**,之类,但是如果产品或测试提出前面需要精准排序,之后再模糊排序,就显得有点棘手。
按序排序+并把符合规则的放到前面
const arr = ['Z1', 'A2', 'B3', 'C4', '2C2', 'H5', 'D6', 'E7', '6K8', '88GC', 'IN', 'INC']; //如果是这种类型,则直接 let str = "E7"; arr.sort().sort((a, b) => str.includes(b) - str.includes(a));
const arr2 = [ {label: 'A2', value: 'A2'}, {label: 'YA2', value: 'YA2'}, {label: 'ZA2', value: 'ZA2'}, {label: 'GG', value: 'GG'}, {label: 'BD', value: 'BD'}, {label: 'C6', value: 'C6'}, {label: '6K8', value: '6K8'}, {label: 'Z0P', value: 'Z0P'}, {label: 'P09', value: 'P09'}, {label: 'E2414', value: 'E2414'}, {label: 'QXX', value: 'QXX'}, {label: 'AN2', value: 'AN2'}, {label: 'MG', value: 'MG'}, {label: 'CG', value: 'CG'}, {label: 'C4', value: 'C4'}, {label: 'CGC', value: 'CGC'}, {label: 'REF', value: 'REF'}, {label: 'RELL', value: 'RELL'}, {label: 'RLL', value: 'RLL'}, ]; //如果是这种类型,则直接 let str = "RE"; arr2 .sort((a, b) => a.label.charCodeAt(0) - b.label.charCodeAt(0)).sort((a, b) => str.includes(b.label) - str.includes(a.label)) .sort((a, b) => (b.label.toUpperCase().slice(0, str.length) === str) - (a.label.toUpperCase().slice(0, str.length) === str));
模糊匹配
// 模糊匹配 arr2.filter(e => e.label.includes(str))
总结:
工作中的筛选往往是排序+模糊匹配+精准匹配符合的内容(非内容全匹配)并将其放到最前面,像我们公司的数据往往上千条,如果用户在用搜索型下拉框时不进行这种操作,体验会非常不好,故优化。
标签:sort,匹配,数组,includes,value,label,str,排序,精准 From: https://www.cnblogs.com/zxd66666/p/17272522.html