• javascript二维数组(3):指定数组元素的特定属性进行搜索


    js中对数组, var data = [{“name”: “《西游记》”, “author”: “吴承恩”, “cat”: “A级书刊”, “num”: 3},{“name”: “《三国演义》”, “author”: “罗贯中”, “cat”: “A级书刊”, “num”: 8},{“name”: “《红楼梦》”, “author”: “曹雪芹”, “cat”: “B级书刊”, “num”: 10}],如何按照不同的元素进行搜索?

    根据数组元素的特定属性搜索

    在JavaScript中,我们可以使用数组的 filter() 方法来根据数组元素的特定属性进行搜索。这个方法会创建一个新的数组,新数组的元素是通过检查指定的函数而符合条件的所有元素。

    var data = [
        {"name": "《西游记》", "author": "吴承恩", "cat": "A级书刊", "num": 3},
        {"name": "《三国演义》", "author": "罗贯中", "cat": "A级书刊", "num": 8},
        {"name": "《红楼梦》", "author": "曹雪芹", "cat": "B级书刊", "num": 10}
    ];
    
    var result = data.filter(function(item) {
        return item.name === "《西游记》";
    });
    
    console.log(result);  // 输出:[{"name": "《西游记》", "author": "吴承恩", "cat": "A级书刊", "num": 3}]
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11

    同样,如果我们想按照 “author” 属性搜索 “曹雪芹”,我们可以这样做:

    var result = data.filter(function(item) {
        return item.author === "曹雪芹";
    });
    
    console.log(result);  // 输出:[{"name": "《红楼梦》", "author": "曹雪芹", "cat": "B级书刊", "num": 10}]
    
    • 1
    • 2
    • 3
    • 4
    • 5

    封装函数

    将上面的代码改进为一个封装函数,以便重复使用。这个函数可以接收两个参数:一个是要搜索的数组,另一个是要搜索的值。函数会返回一个新数组,包含所有匹配的元素。

    下面是一个示例:

    function searchByProperty(array, property, value) {
        return array.filter(function(item) {
            return item[property] === value;
        });
    }
    
    // 使用示例:
    var data = [
        {"name": "《西游记》", "author": "吴承恩", "cat": "A级书刊", "num": 3},
        {"name": "《三国演义》", "author": "罗贯中", "cat": "A级书刊", "num": 8},
        {"name": "《红楼梦》", "author": "曹雪芹", "cat": "B级书刊", "num": 10}
    ];
    
    var result = searchByProperty(data, 'name', '《西游记》');
    console.log(result);  // 输出:[{"name": "《西游记》", "author": "吴承恩", "cat": "A级书刊", "num": 3}]
    
    var result2 = searchByProperty(data, 'author', '曹雪芹');
    console.log(result2);  // 输出:[{"name": "《红楼梦》", "author": "曹雪芹", "cat": "B级书刊", "num": 10}]
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18

    在这个示例中,searchByProperty 函数接受三个参数:array(要搜索的数组),property(要搜索的属性名称,如 ‘name’ 或 ‘author’),以及 value(要搜索的值,如 ‘《西游记》’ 或 ‘曹雪芹’)。

    多个属性搜索

    为了支持按多个属性进行搜索,修改一下 searchByProperty 函数,让 property 参数接受一个属性名称的数组,然后在 filter 函数中检查每个属性是否匹配。

    下面是一个示例:

    function searchByProperties(array, properties, value) {
        return array.filter(function(item) {
            for (var i = 0; i < properties.length; i++) {
                if (item[properties[i]] === value) {
                    return true;
                }
            }
            return false;
        });
    }
    
    // 使用示例:
    var data = [
        {"name": "《西游记》", "author": "吴承恩", "cat": "A级书刊", "num": 3},
        {"name": "《三国演义》", "author": "罗贯中", "cat": "A级书刊", "num": 8},
        {"name": "《红楼梦》", "author": "曹雪芹", "cat": "B级书刊", "num": 10}
    ];
    
    var result = searchByProperties(data, ['name', 'author'], '《西游记》');
    console.log(result);  // 输出:[{"name": "《西游记》", "author": "吴承恩", "cat": "A级书刊", "num": 3}]
    
    var result2 = searchByProperties(data, ['author', 'cat'], '曹雪芹');
    console.log(result2);  // 输出:[{"name": "《红楼梦》", "author": "曹雪芹", "cat": "B级书刊", "num": 10}]
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23

    在这个示例中,searchByProperties 函数接受三个参数:array(要搜索的数组),properties(要搜索的属性名称的数组,如 ['name', 'author']['author', 'cat']),以及 value(要搜索的值,如 ‘《西游记》’ 或 ‘曹雪芹’)。函数会返回一个新数组,包含所有在至少一个属性上匹配的元素。


    @漏刻有时

  • 相关阅读:
    Python实践:基于Matplotlib实现某产品全年销量数据可视化
    六千字呕心沥血深度总结,为您揭秘ClickHouse为什么查询这么快!
    java计算机毕业设计网上图书分享系统源码+系统+mysql数据库+lw文档+部署
    Vue中使用pdf.js实现在线预览pdf文件流
    小啊呜产品读书笔记001:《邱岳的产品手记-12》第22讲 产品经理的图文基本功(上):产品文档 & 23讲产品经理的图文基本功(下):产品图例
    家乡主题网页设计代码 旅游主题网页设计 html静态网页设计制作 dw静态网页成品模板素材网页 web前端网页设计与制作 div静态网页设计
    google abseil c++ tips[55] name counting and unique_ptr 变量名计数和unique_ptr
    Linux系统中常用的压缩与解压缩方法
    element-plus ElMessageBox 实现复制功能,动态点击html元素不生效解决
    【无标题】
  • 原文地址:https://blog.csdn.net/weixin_41290949/article/details/133541308