js filter,every,includes 过滤数组

背景：

     页面：在项目中遇到的，前端页面显示为，顶部是下拉搜索条件,下面是一个表格；

     数据：接口请求一次性拿到所有：搜索条件里的下拉选项和表格中的数据；

     现状：需要前端在搜索条件时，筛选表格数据展示，在前端进行筛选；

    为什么不在后端进行筛选？

    答：在某个页面中，接口已经把所有进行数据都返回前端展示了，现在的页面只是多了筛选查看，后端不想再提供接口，让前端还是调用之前的接口进行处理。

  案例一

  let arr = [
      {
        type: 'uddaas,xiao',
        name: '红色,小',
      },
      {
        type: 'ffoop,da',
        name: '黄色,大',
      },
      {
        type: 'hhhugd,da',
        name: '绿色,大',
      },
    ]
    console.log('原始数据：', arr)
    let str1 = ['ffoop','da']
    
  

   先过滤，再把指定字符串转换为数组，再通过数组比对，返回true或false,查找到对应的数据；

  let results1 = arr.filter( (v) => {
      // filter过滤数组
      // 字符串转换数组
      let typesId = v.type.split(',') 
      return str1.every((e) => {
        // every查找符合的元素
        // includes判断数组是否包含指定的值，有则返回true,否则返回false
        return typesId.includes(e)
      })
    })
    console.log('results1:',results1)
//     {
//     "type": "ffoop,da",
//     "name": "黄色,大"
// }

    案例二
   

 let arr1 = [12,13,14,15,16]
 
    let iniArr = []
 
    let arr2 = [1000,2000,3000]
 
    let obj1 = [
 
      {
 
        arr: [1000,2000,3000],
 
        title: '数字信息',
 
      },
 
      {
 
        arr: [1100,2100,3100],
 
        title: '数字信息1',
 
      },
 
      {
 
        arr: [1200,2200,3200],
 
        title: '数字信息2',
 
      },
 
    ]

     通过filter过滤,在过滤中使用every查找，并通过includes验证是否有符合的数据，有则返回true,否则返回false
  

  let filterObj = obj1.filter((v1) => {
 
 
      return iniArr.every((e1) => {
 
        return v1.arr.includes(e1)
 
      })
 
    })
 
    console.log('filterObj:',filterObj)  
 
    // {
 
//     "arr": [
 
//         1100,
 
//         2100,
 
//         3100
 
//     ],
 
//     "title": "数字信息1"
 
// }

不足：在写这部分需求时，花费了较长时间，没有想到filter,every和includes的处理思路，请教了同事后才解决，自己的基础知识还需要打磨。