前端独立实现模糊查询--filter()与match()

ilter()方法和match()方法结合使用可以使前端已获取数据的情况下独立实现模糊查询,不再调用后端接口,这种情况适用与查询次数比较多,且数据比较固定的情况,减少调用后端接口一定程度上可以缓解后端压力。

示例:
 teacherList = allTeacherList.filter(array => array.name.match(searchContent));
1
这里有几个小tips需要解释一下:

首先,allTeacherList里面放的是待查的所有数据,我这里放的是一个课程信息的对象数组;
其次,filter()方法主要是用来过滤复合条件的数据的,返回的是所有符合条件的数据。
然后,=>() 是一个箭头函数,旨在解决javascript的this指向问题。这里的array=> array 指的是数组中要过滤的每个对象元素。array可以用其他变量代替。
最后,match() 方法是用来模糊匹配的,可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。 我这里检测的是教师对象的name属性值匹配到searchContent这个输入内容的对象信息。最后赋值给了teacherList。

前端独立实现模糊查询--filter()与match()_第1张图片

前端独立实现模糊查询--filter()与match()_第2张图片
补充:
find()方法与filter()都适用于过滤查找数据,用法一样,只是返回结果不一样,filter()过滤出满足条件的所有数据,支持多条;find()用于检测满足条件的单条数据;

 


转自:https://blog.csdn.net/YYZZHC999/article/details/84205455 

你可能感兴趣的:(前端独立实现模糊查询--filter()与match())