js对二维数组的精确和模糊筛选并输出的封装函数

简介: js对二维数组的精确和模糊筛选并输出的封装函数

项目需求

在实际项目开发中,对二维数组的筛选一般是在后端进行,但有时前端也需要对数据进行过滤、筛选和清洗。本次项目的实际生产环境是对百度离线地图的数据进行筛选,减少后台的开发量

被筛选数组

    //被筛选数组
    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!

相关文章
|
5天前
|
自然语言处理 JavaScript 前端开发
JavaScript闭包是函数访问外部作用域变量的能力体现,它用于封装私有变量、持久化状态、避免全局污染和处理异步操作。
【6月更文挑战第25天】JavaScript闭包是函数访问外部作用域变量的能力体现,它用于封装私有变量、持久化状态、避免全局污染和处理异步操作。闭包基于作用域链和垃圾回收机制,允许函数记住其定义时的环境。例如,`createCounter`函数返回的内部函数能访问并更新`count`,每次调用`counter()`计数器递增,展示了闭包维持状态的特性。
20 5
|
3天前
|
JavaScript 前端开发
JavaScript作用域关乎变量和函数的可见范围。
【6月更文挑战第27天】JavaScript作用域关乎变量和函数的可见范围。全局作用域适用于整个脚本,局部作用域限于函数内部,而ES6引入的`let`和`const`实现了块级作用域。全局变量易引发冲突和内存占用,局部作用域在函数执行后消失,块级作用域提高了变量管理的灵活性。作用域关键在于组织代码和管理变量生命周期。
13 1
|
5天前
|
存储 JavaScript 前端开发
JavaScript中的对象是数据结构,存储键值对,键为字符串,值可为任意类型,包括函数(作为方法)
【6月更文挑战第25天】JavaScript中的对象是数据结构,存储键值对,键为字符串,值可为任意类型,包括函数(作为方法)。
10 2
|
5天前
|
JavaScript 前端开发
JavaScript函数核心概念:用于代码复用与管理。
【6月更文挑战第25天】JavaScript函数核心概念:用于代码复用与管理。示例包括定义(无参、有参、有返回值)与调用,参数按值传递。函数内修改参数不影响外部变量。
9 1
|
2天前
|
前端开发 JavaScript 程序员
探索JavaScript宝库:打开基础知识与实用技能之门(数据类型与变量+ 条件与循环+函数与模块+DOM+异常+ES6)
探索JavaScript宝库:打开基础知识与实用技能之门(数据类型与变量+ 条件与循环+函数与模块+DOM+异常+ES6)
3 0
|
3天前
|
JavaScript 前端开发
程序技术好文:第一百三十八节,JavaScript,封装库
程序技术好文:第一百三十八节,JavaScript,封装库
|
5天前
|
自然语言处理 前端开发 JavaScript
JavaScript 函数指南:掌握编程密钥库的精髓
JavaScript 函数指南:掌握编程密钥库的精髓
|
5天前
|
前端开发 JavaScript 安全
解锁 JavaScript ES6:函数与对象的高级扩展功能
解锁 JavaScript ES6:函数与对象的高级扩展功能
|
5天前
|
JavaScript
js -- 函数总结篇,函数提升、动态参数、剩余参数、箭头函数、this指向......
js -- 函数总结篇,函数提升、动态参数、剩余参数、箭头函数、this指向......
|
5天前
|
存储 JavaScript 前端开发
JavaScript——JavaScript基础:数组 | JavaScript函数:使用、作用域、函数表达式、预解析
在JavaScript中,内嵌函数可以访问定义在外层函数中的所有变量和函数,并包括其外层函数能访问的所有变量和函数。①全局变量:不在任何函数内声明的变量(显式定义)或在函数内省略var声明的变量(隐式定义)都称为全局变量,它在同一个页面文件中的所有脚本内都可以使用。函数表达式与函数声明的定义方式几乎相同,不同的是函数表达式的定义必须在调用前,而函数声明的方式则不限制声明与调用的顺序。③块级变量:ES 6提供的let关键字声明的变量称为块级变量,仅在“{}”中间有效,如if、for或while语句等。
21 0