如何基于多条件对数组进行筛选，同时控制过滤后结果最多30条

错误原因 #

• 你搞反了includes的调用主体：includes是数组方法，用于判断指定值是否在当前数组中，你需要判断的是当前项的tag值是否在筛选标签数组needToFind里，而不是在字符串类型的tag里查找整个数组
• 没有处理tag为null的边界场景，直接调用方法会触发报错
• 没有兼容筛选标签数组为空时返回全部数据的逻辑
• 没有补充返回结果最多30条的长度控制逻辑

修正后的代码 #

const arr = [
    { "value": "food", "tag": "food" },
    { "value": "drink1", "tag": "drink" },
    { "value": "drink2", "tag": "drink" },
    { "value": "empty tag data", "tag": null }
];

const data1 = ["food", "drink"];
const data2 = [];

function example(arrayForSearch, needToFind) {
    // 筛选逻辑：筛选标签非空就按标签过滤，否则直接用全部原数据
    const filtered = needToFind.length > 0 
        ? arrayForSearch.filter(item => item.tag && needToFind.includes(item.tag))
        : [...arrayForSearch]
    // 截断最多返回30条，提取value字段返回
    return filtered.slice(0, 30).map(item => item.value)
}

console.log(example(arr, data1)); // 输出：['food', 'drink1', 'drink2']
console.log(example(arr, data2)); // 输出：['food', 'drink1', 'drink2', 'empty tag data']

逻辑说明 #

• 先判断筛选标签数组是否为空，非空时执行过滤，同时先判断item.tag存在，避免空值调用方法报错
• 用slice(0,30)统一控制返回结果长度，不管是筛选后还是全量数据都最多返回30条
• 最后统一提取value字段返回，和你原有逻辑的输出格式保持一致

内容的提问来源于stack exchange，提问作者Alice