如何用.filter比较数组元素？循环筛选球员ID结果异常求助

嘿，这个问题我太熟悉啦！你当前的代码确实存在一个典型的「变量覆盖」问题——每次for循环都会重新给$scope.filterhockeyPlayers赋值，导致前几次循环筛选出的球员记录被彻底覆盖，最后只留下最后一个ID（也就是21）对应的结果。

原代码的核心问题 #

看这段循环逻辑：

for (var k = 0; k < $scope.hockeyPlayersId.length; k++) {
    var val = $scope.hockeyPlayersId[k];
    // 每次循环都直接赋值，覆盖之前的结果
    $scope.filterhockeyPlayers = $scope.Players.filter(...);
}

第一次循环筛选出ID为22的球员，赋值给filterhockeyPlayers；第二次循环筛选出12的球员，直接把之前的22结果覆盖掉；第三次循环筛选21，又覆盖掉12的结果，最终就只剩21的球员了。

两种修正方案 #

方案1：保留循环逻辑，改为合并结果

先初始化一个空数组，每次循环把筛选出的球员追加到数组里，而不是覆盖：

// 先初始化空数组，避免覆盖
$scope.filterhockeyPlayers = [];

for (var k = 0; k < $scope.hockeyPlayersId.length; k++) {
    var val = $scope.hockeyPlayersId[k];
    // 单次筛选匹配当前ID的球员
    var matched = $scope.Players.filter(function(obj) {
        return obj.PlayersId === val;
    });
    // 把结果合并到总数组中
    $scope.filterhockeyPlayers = $scope.filterhockeyPlayers.concat(matched);
}

方案2：更高效的单次筛选（推荐）

直接用一次filter方法，判断球员ID是否在目标ID列表中，不用循环遍历ID数组，代码更简洁，性能也更好：

// 利用includes判断ID是否在目标列表中（ES6+支持）
$scope.filterhockeyPlayers = $scope.Players.filter(function(obj) {
    return $scope.hockeyPlayersId.includes(obj.PlayersId);
});

如果需要兼容旧版浏览器（不支持includes），可以用indexOf替代：

$scope.filterhockeyPlayers = $scope.Players.filter(function(obj) {
    return $scope.hockeyPlayersId.indexOf(obj.PlayersId) !== -1;
});

为什么方案2更好？ #

• 代码更简洁，可读性更强
• 性能更优：只需要遍历一次$scope.Players数组，而方案1需要遍历N次（N是hockeyPlayersId的长度）
• 避免循环中的变量覆盖问题，逻辑更清晰

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