如何用jQuery/JS在对象数组中基于元素部分匹配查找对象

预处理步骤 #

先把逗号分隔的字符串转成无空格、非空的数组，避免格式干扰：

// 处理新对象的pit值，转成干净的数组
const newPitList = pit.split(',').map(item => item.trim()).filter(Boolean);

1. 原生JS的find方法（仅返回第一个匹配对象） #

find遍历数组时会返回第一个满足条件的对象，适合判断是否存在匹配项：

const matchedItem = mappings.find(item => {
    // 条件1：id或ip与新对象一致
    const isIdOrIpMatch = item.id == id || item.ip === ip;
    if (isIdOrIpMatch) return true;

    // 条件2：新对象的pit任意值存在于当前item的pain_in_the中
    const currentPitList = item.pain_in_the.split(',').map(i => i.trim()).filter(Boolean);
    // 检查两个数组是否有交集
    return newPitList.some(pitVal => currentPitList.includes(pitVal));
});

// 若matchedItem不为undefined，说明存在匹配对象
console.log(matchedItem);

2. jQuery的$.grep方法（返回所有匹配对象） #

$.grep会返回数组中所有符合条件的元素，适合需要获取全部匹配项的场景：

const matchedItems = $.grep(mappings, item => {
    // 条件1：id或ip匹配
    const isIdOrIpMatch = item.id == id || item.ip === ip;
    if (isIdOrIpMatch) return true;

    // 条件2：pit值存在交集
    const currentPitList = item.pain_in_the.split(',').map(i => i.trim()).filter(Boolean);
    return newPitList.some(pitVal => currentPitList.includes(pitVal));
});

// matchedItems是所有满足条件的对象组成的数组
console.log(matchedItems);

关于多匹配项的问题 #

当pit值为"10, 2, 8"时：

• 使用$.grep会返回两个对象：id为1（pain_in_the包含2）和id为2（pain_in_the包含8）的对象，因为它会收集所有符合条件的元素。
• 使用find只会返回第一个匹配到的对象（即id为1的那个），因为它找到第一个符合条件的元素后就会停止遍历。

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