项目需求
在实际项目开发中,对二维数组的筛选一般是在后端进行,但有时前端也需要对数据进行过滤、筛选和清洗。本次项目的实际生产环境是对百度离线地图的数据进行筛选,减少后台的开发量
被筛选数组
//被筛选数组 var data = [ {"name": "《西游记》", "author": "吴承恩", "cat": "A级书刊"}, {"name": "《三国演义》", "author": "罗贯中", "cat": "A级书刊"}, {"name": "《红楼梦》", "author": "曹雪芹", "cat": "A级书刊"} ];
单击事件
//单击事件 $(function () { $("#btn").click(function () { var name = "西游记"; var author = "吴承恩"; console.log(filterData(data, name, author)) }) })
数据筛选
在CSDN找到更多的是对二维数据的“精确匹配筛选”,主要采用的是js数组的过滤函数进行操作。但是出于对项目的灵活性,还是推荐“模糊匹配”。
精确筛选
//筛选条件封装函数-精确匹配; function filterData(data, name, author) { return data.filter(item => item.name == name || item.author == author) }
模糊匹配
//筛选条件封装函数-模糊匹配; function getProbably(list, keyWord) { var arr = []; for (var i = 0; i < list.length; i++) { //将JSON对象转为字符串后进行匹配筛选,如果字符串中不包含目标字符会返回-1; if (JSON.stringify(list[i]).indexOf(keyWord) >= 0) { arr.push(list[i]); } } return arr; }
lockdatav Done!