功能——模糊查询

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

思路:1.先获取搜索框的内容及要查询的数据
   2.通过循环的方法对数据进行筛选如 filter方法

   3.用mach()方法去匹配,符合条件的进行返回

示例:

 teacherList = allTeacherList.filter(array => array.name.match(searchContent));

这里有几个小tips需要解释一下:

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

补充:
find()方法与filter()都适用于过滤查找数据,用法一样,只是返回结果不一样,filter()过滤出满足条件的所有数据,支持多条;find()用于检测满足条件的单条数据;

 

filter方法详解

posted @ 2021-06-10 08:32  㭌(mou)七  阅读(794)  评论(0编辑  收藏  举报