JavaScript中JSON数组filter与for循环的性能对比（批量用户筛选场景）

我需要筛选出属于"A"组的用户列表（用户可归属多个组），现有两种实现方式：

方法1：

let data = userList.filter(u => u.group.filter(g => g === "A").length > 0)

方法2：

let data = []
for(let n = 0; n < userList.length; n++){
    let u = userList[n]
    if(u.group.filter(g => g === "A").length > 0){
        data.push(u);
    }
}

注：已修正代码错误。

想了解当userList数据量较大时，哪种方式性能更优？

性能分析与结论 #

这两种方法的整体性能几乎没有差别，原因如下：

1. 核心性能消耗点完全一致：两者判断用户是否属于"A"组的逻辑都是u.group.filter(g => g === "A").length > 0——这个操作会完整遍历整个group数组，哪怕中途已经找到"A"，仍会继续遍历剩余元素，这是最大的性能开销来源。
2. 外层遍历的差异可以忽略：方法1用数组filter高阶函数，方法2用手动for循环，在现代JS引擎（如V8）的优化下，两者的遍历性能差距微乎其微，大数据量下不会有明显区别。

更关键的优化建议 #

其实这两种方法都有可优化的空间，核心是避免不必要的数组遍历：

• 用u.group.includes("A")替代u.group.filter(...)：includes会在找到第一个匹配项后立即返回结果，无需遍历整个数组，能显著提升性能（尤其是当group数组较长时）。

优化后的代码示例：
方法1优化版：

let data = userList.filter(u => u.group.includes("A"))

方法2优化版：

let data = []
for(let n = 0; n < userList.length; n++){
    let u = userList[n]
    if(u.group.includes("A")){
        data.push(u);
    }
}

如果追求极致性能（比如group数组极大），可以用手动循环提前终止：

function hasGroupA(groups) {
    for (let i = 0; i < groups.length; i++) {
        if (groups[i] === "A") return true;
    }
    return false;
}

// 对应方法1的优化
let data = userList.filter(u => hasGroupA(u.group));

内容的提问来源于stack exchange，提问作者N.D.H.Vu