Javascript - filter array of objects based on key's value existing in a separate array

Question

Fairly new to Javascript as I'm working on my first app, I am coming over from R where though data manipulations (with dplyr or even base R) become very easy, but I am struggling with this currently. I have the following data:

var teamsA = ['team1', 'team2', 'team3'];
var teamsB = ['team4', 'team5', 'team6'];

var teamgroup = A;

var myData = [
    {player: "Joe", team: "team1"},
    {player: "Tom", team: "team3"},
    {player: "Red", team: "team2"},
    {player: "Smi", team: "team5"},
    {player: "Bib", team: "team6"},
    {player: "Cat", team: "team2"},
    {player: "Dan", team: "team3"},
    {player: "Jim", team: "team1"}
]

With the data shown, the question is fairly simple: I would like to filter myData based on the team existing in whichever array is determined by the teamgroup variable. ie:

if(teamgroup == "A") { 
    myData.filter(team in teamsA) 
} else {
    myData.filter(team in teamsB)
}

...not quite sure how to do so with javascript. Prefer to use the new ES6 stuff. Thanks!

where is the connection between `A` and the two variables `teamsA` and `teamsB`? wound an object with properties `A` and `B` fit better for the selection for filtering? — Nina Scholz, Apr 18 '18 at 18:29

score 2 · Accepted Answer · answered Apr 18 '18 at 18:24

You could use a function which takes players and the teams array and filter with Array#includes.

function getTeam(players, teams) {
    return players.filter(({ team }) => teams.includes(team));
}

var teamsA = ['team1', 'team2', 'team3'],
    teamsB = ['team4', 'team5', 'team6'],
    myData = [{ player: "Joe", team: "team1" }, { player: "Tom", team: "team3" }, { player: "Red", team: "team2" }, { player: "Smi", team: "team5" }, { player: "Bib", team: "team6" }, { player: "Cat", team: "team2" }, { player: "Dan", team: "team3" }, { player: "Jim", team: "team1" }];

console.log(getTeam(myData, teamsA));
console.log(getTeam(myData, teamsB));

.as-console-wrapper { max-height: 100% !important; top: 0; }

score 1 · Answer 2 · answered Apr 18 '18 at 18:21

You can use filter much like you intend to

var teamsA =
  [ 'team1', 'team2', 'team3' ]
  
var teamsB =
  [ 'team4', 'team5', 'team6' ]

var myData =
  [ {player: "Joe", team: "team1"}
  , {player: "Tom", team: "team3"}
  , {player: "Red", team: "team2"}
  , {player: "Smi", team: "team5"}
  , {player: "Bib", team: "team6"}
  , {player: "Cat", team: "team2"}
  , {player: "Dan", team: "team3"}
  , {player: "Jim", team: "team1"}
  ]

const A =
  myData.filter (p => teamsA.includes (p.team))
  
const B =
  myData.filter (p => teamsB.includes (p.team))
  
console.log (A) // Joe Tom Red Cat Dan Jim
console.log (B) // Smi Bib

Though it would be better to make a function

const playersForTeams = (players, teams) =>
  players.filter (p => teams.include (p.team))

const A =
  playersForTeams (myData, teamsA)

const B =
  playersForTeams (myData, teamsB)

console.log (A) // Joe Tom Red Cat Dan Jim
console.log (B) // Smi Bib

@TheIncorrigible1 thanks for the remark, ha! I'm all about reminding programmers who's the boss: [you, not your language](https://stackoverflow.com/a/46918344/633183). — Mulan, Apr 18 '18 at 18:31

Christian Vincenzo Traina · Answer 3 · 2018-04-18T18:23:41.130

-1

var teamsA = ['team1', 'team2', 'team3'];
var teamsB = ['team4', 'team5', 'team6'];

// What's the purpose of the below line?
// var teamgroup = A;


var myData = [
    {player: "Joe", team: "team1"},
    {player: "Tom", team: "team3"},
    {player: "Red", team: "team2"},
    {player: "Smi", team: "team5"},
    {player: "Bib", team: "team6"},
    {player: "Cat", team: "team2"},
    {player: "Dan", team: "team3"},
    {player: "Jim", team: "team1"}
]

console.log(myData.filter(item => teamsA.indexOf(item.team) !== -1))

edited Apr 18 '18 at 18:23

answered Apr 18 '18 at 18:21

Christian Vincenzo Traina

9,546
2
40
63

in my React App, teamgroupA is passed as a prop to the component that does this work. – Canovice Apr 18 '18 at 18:23

score -1 · Answer 4 · answered Apr 18 '18 at 18:23

var teamsA = ['team1', 'team2', 'team3'];
var teamsB = ['team4', 'team5', 'team6'];

var teamgroup = 'A';

var myData = [
    {player: "Joe", team: "team1"},
    {player: "Tom", team: "team3"},
    {player: "Red", team: "team2"},
    {player: "Smi", team: "team5"},
    {player: "Bib", team: "team6"},
    {player: "Cat", team: "team2"},
    {player: "Dan", team: "team3"},
    {player: "Jim", team: "team1"}
]

if(teamgroup == 'A'){
  myData = myData.filter((player)=> teamsA.includes(player.team))
} else {
  myData = myData.filter((player)=> teamsB.includes(player.team))

}

console.log(myData)

going to check all the solutions but this one looks particularly clean / what I am looking for. — Canovice, Apr 18 '18 at 18:24

Javascript - filter array of objects based on key's value existing in a separate array

4 Answers4