How to filter array of objects from keys in javascript?

Question

Here, I have one main array called mainArray. In this array I added multiple users list. It can be increased. I can create many group from this mainarray, like group1, group2 and so on. My requirement is, i want to filter objects from mainArray, which haven't added in the groups.

Array main,

var mainArray = [{
  userId: "M000001",
  name: "Jhon",
  companyId: "C0000021"
}, {
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}, {
  userId: "M000006",
  name: "Roldan",
  companyId: "C0000026"
}, {
  userId: "M000007",
  name: "Mike",
  companyId: "C0000027"
}, {
  userId: "M000008",
  name: "Mia",
  companyId: "C0000028"
}];

Groups,

var group1 = [{
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}];

var group2 = [{
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000001",
  name: "John",
  companyId: "C0000021"
}];

Joined group ids,

var joinedGroupIds = ["M000004", "M000005", "M000002", "M000003", "M000001"];

The output which i want to be,

var result = [{
  {
    userId: "M000006",
    name: "Roldan",
    companyId: "C0000026"
  }, {
    userId: "M000007",
    name: "Mike",
    companyId: "C0000027"
  }, {
    userId: "M000008",
    name: "Mia",
    companyId: "C0000028"
  }
}];

my javascript code,

var joinGroup, joinedGroupIds = [];
joinGroup = group1.concat(group2);

Concatinated group ids,

joinedGroupIds.map(function(el){
  joinedGroupIds.push(el.userId);
});

Filter objects from main array,

var result = mainArray.filter(function(item) {
  if (joinedGroupIds.indexOf(item.userId) !== -1) return item;
});

Please read minimal reproducible example

mplungjan
– mplungjan

2016-11-13 07:37:50 +00:00
Commented Nov 13, 2016 at 7:37 — mplungjan
– mplungjan, Commented Nov 13, 2016 at 7:37
provide your code so that we can try on that.

ScanQR
– ScanQR

2016-11-13 07:39:23 +00:00
Commented Nov 13, 2016 at 7:39 — ScanQR
– ScanQR, Commented Nov 13, 2016 at 7:39
@Rajesh, i have added the my javascript code. Kindly check

Sathya
– Sathya

2016-11-13 07:43:50 +00:00
Commented Nov 13, 2016 at 7:43 — Sathya
– Sathya, Commented Nov 13, 2016 at 7:43

Community · Accepted Answer · 2020-06-20 09:12:55Z

indexOf will not work for searching inside arrays. Use .findIndex

var result = mainArray.filter(function(x) {
  return joinedGroup.findIndex(function(y) {
    return y.userId === x.userId
  }) === -1
})

var mainArray = [{
  userId: "M000001",
  name: "Jhon",
  companyId: "C0000021"
}, {
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}, {
  userId: "M000006",
  name: "Roldan",
  companyId: "C0000026"
}, {
  userId: "M000007",
  name: "Mike",
  companyId: "C0000027"
}, {
  userId: "M000008",
  name: "Mia",
  companyId: "C0000028"
}];

var group1 = [{
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}];
var group2 = [{
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000001",
  name: "John",
  companyId: "C0000021"
}];
var joinedGroup = group1.concat(group2);

var result = mainArray.filter(function(x) {
  return joinedGroup.findIndex(function(y) {
    return y.userId === x.userId
  }) === -1
})

console.log(result)

Save `userIds` in joinedGroup

var joinedGroup = [];
group1.forEach(x => joinedGroup.push(x.userId))
group2.forEach(x => joinedGroup.push(x.userId))

var result = mainArray.filter(function(x) {
  return joinedGroup.indexOf(x.userId) === -1
})

var mainArray = [{
  userId: "M000001",
  name: "Jhon",
  companyId: "C0000021"
}, {
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}, {
  userId: "M000006",
  name: "Roldan",
  companyId: "C0000026"
}, {
  userId: "M000007",
  name: "Mike",
  companyId: "C0000027"
}, {
  userId: "M000008",
  name: "Mia",
  companyId: "C0000028"
}];

var group1 = [{
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}];
var group2 = [{
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000001",
  name: "John",
  companyId: "C0000021"
}];

var joinedGroup = [];
group1.forEach(x => joinedGroup.push(x.userId))
group2.forEach(x => joinedGroup.push(x.userId))

var result = mainArray.filter(function(x) {
  return joinedGroup.indexOf(x.userId) === -1
})

console.log(result)

Ori Drori · Accepted Answer · 2016-11-13 08:11:44Z

Create an index of the existing items in the groups, then use it to filter the original array.

ES6 (since you're using React):

const filterByGroups = (arr, ...groups) => {
  // create a Set of existing userId in the groups
  const exitingItems = new Set(
    [].concat([], ...groups).map(({ userId }) => userId)
  );

  // filter from the array all items that their userId exists in the Set
  return arr.filter(({ userId }) => !exitingItems.has(userId));
};

var mainArray = [{
  userId: "M000001",
  name: "Jhon",
  companyId: "C0000021"
}, {
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}, {
  userId: "M000006",
  name: "Roldan",
  companyId: "C0000026"
}, {
  userId: "M000007",
  name: "Mike",
  companyId: "C0000027"
}, {
  userId: "M000008",
  name: "Mia",
  companyId: "C0000028"
}];

var group1 = [{
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}];

var group2 = [{
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000001",
  name: "John",
  companyId: "C0000021"
}];

const result = filterByGroups(mainArray, group1, group2);

console.log(result);

Using lodash:

function filterByGroups(arr) {
  var existingItems = _([].slice.call(arguments, 1))
    .flatten()
    .keyBy('userId')
    .value();

  return arr.filter(function(item) {
    return !existingItems[item.userId];
  });
}

var mainArray = [{
  userId: "M000001",
  name: "Jhon",
  companyId: "C0000021"
}, {
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}, {
  userId: "M000006",
  name: "Roldan",
  companyId: "C0000026"
}, {
  userId: "M000007",
  name: "Mike",
  companyId: "C0000027"
}, {
  userId: "M000008",
  name: "Mia",
  companyId: "C0000028"
}];

var group1 = [{
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}];

var group2 = [{
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000001",
  name: "John",
  companyId: "C0000021"
}];

var result = filterByGroups(mainArray, group1, group2);

console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.16.6/lodash.min.js"></script>

Sreekanth · Accepted Answer · 2016-11-13 08:24:11Z

You could make use of differenceWith method and get this done.

let comparator = (a, b) => JSON.stringify(a) === JSON.stringify(b);

let result = _.differenceWith(mainArray, group1.concat(group2), comparator);

Here is the working solution.

Documentation: _.differenceWith

var mainArray = [{
  userId: "M000001",
  name: "John",
  companyId: "C0000021"
}, {
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}, {
  userId: "M000006",
  name: "Roldan",
  companyId: "C0000026"
}, {
  userId: "M000007",
  name: "Mike",
  companyId: "C0000027"
}, {
  userId: "M000008",
  name: "Mia",
  companyId: "C0000028"
}];

var group1 = [{
  userId: "M000004",
  name: "Sean",
  companyId: "C0000024"
}, {
  userId: "M000005",
  name: "Paul",
  companyId: "C0000025"
}];

var group2 = [{
  userId: "M000002",
  name: "Leon",
  companyId: "C0000022"
}, {
  userId: "M000003",
  name: "Thomas",
  companyId: "C0000023"
}, {
  userId: "M000001",
  name: "John",
  companyId: "C0000021"
}];

let comparator = (a, b) => JSON.stringify(a) === JSON.stringify(b);

let result = _.differenceWith(mainArray, group1.concat(group2), comparator);

console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.16.6/lodash.min.js"></script>

Collectives™ on Stack Overflow

How to filter array of objects from keys in javascript?

3 Answers 3

Save `userIds` in joinedGroup

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Save userIds in joinedGroup

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related

Save `userIds` in joinedGroup