• 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(要搜索的值,如 ‘《西游记》’ 或 ‘曹雪芹’)。函数会返回一个新数组,包含所有在至少一个属性上匹配的元素。


    @漏刻有时

  • 相关阅读:
    MySQL(进阶篇--InnoDB引擎)
    工作摸鱼秘籍
    JavaEE进阶常见面试问题 - 细节狂魔
    文心一言 VS 讯飞星火 VS chatgpt (101)-- 算法导论9.3 7题
    微信小程序抓包-夜神模拟器结合BurpSuite抓包(可用于现在最新版本微信)
    chatGPT的前世今生
    Spring Boot + Vue + Element UI的网上商城后台管理之订单管理系统
    华为OD 完全二叉树非叶子部分后序遍历(200分)【java】A卷+B卷
    CodeTON Round 3 (Div. 1 + Div. 2, Rated, Prizes!) A~D 题解
    【JavaScript预解析】
  • 原文地址:https://blog.csdn.net/weixin_41290949/article/details/133541308