有一个需求是在前端部分完成筛选功能,一次拿到所有数据,然后根据条件筛选。通常情况下筛选是后台给接口,在数据量不大的情况下,也有人可能会遇到前端筛选这样的情况。
一般情况下的单条件筛选,数组的filter方法就能够满足需求,本文讨论的重点是多条件下的复合筛选,并列出了几个相关知识点。
// 这个是例子中的被筛选数组 var aim = [ {name:'Anne', age: 23, gender:'female'}, {name:'Leila', age: 16, gender:'female'}, {name:'Jay', age: 19, gender:'male'}, {name:'Mark', age: 40, gender:'male'} ]
单条件单数据筛选;
根据单个名字筛选,用filter方法,判断name是否为目标名字即可;
// 根据单个名字筛选 function filterByName(aim, name) { return aim.filter(item => item.name == name) } // 输入 aim 'Leila' 期望输出为 [{name:'Leila', age: 16, gender:'female'}] console.log(filterByName(aim,'leila'))
单条件多数据筛选;
// 根据多个名字筛选 function filterByName1(aim, nameArr) { let result = [] for(let i = 0; i < nameArr.length; i++) { result.push(aim.find(item => item.name = nameArr[i])) } return result } // 输入 aim ['Anne','Jay'] //期望输出为 [{name:'Anne', age: 23, gender:'female'},{name:'Jay', age: 19, gender:'male'}] console.log(filterByName1(aim,['Leila','Jay'])) // 有BUG 改进后