Filter out objects from another array in a loop

Question

I have an allItems array of objects

allItems = [
    { id: 1, name: 'item1' },
    { id: 2, name: 'item2' },
    { id: 3, name: 'item3' }
]

I want it to filter out and not contain the objects contained in another array from my component.

fewItems = [
    { id: 2, name: 'item2' }
]

so, filteredItems should be :

filteredItems = [
    { id: 1, name: 'item1' },
    { id: 3, name: 'item3' }
]

And when another object from allItems is added to fewItems, it needs to disappear from the filteredItems one.

I would like to do this in pure vanilla JS, with no specific library.

Thanks ahead !

Do you want to be able to do this with just JavaScript or with a library? — Chris
– Chris, Commented Oct 23, 2017 at 17:32
@Chris you're right I should have specified this in the question. Edited again. — Jeremy Belolo
– Jeremy Belolo, Commented Oct 23, 2017 at 18:22
@JeremyBelolo I think you made a much better question with those simple changes. — Chris
– Chris, Commented Oct 24, 2017 at 14:14

Richard Medeiros · Accepted Answer · 2017-10-23 18:08:42Z

2

filteredItems =  this.allItems.filter(x => {
    return !this.fewItems.some(y => JSON.stringify(y) == JSON.stringify(x))
});

edited Oct 23, 2017 at 18:08

answered Oct 23, 2017 at 17:57

Richard Medeiros

97810 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Nick Timmer Over a year ago

just be carefull with stringify stackoverflow.com/questions/15376185/….

Nick Timmer · Accepted Answer · 2017-10-23 17:49:52Z

1

var allItems = [
     { id: 1, name: 'item1' },
        { id: 2, name: 'item2' },
        { id: 3, name: 'item3' }
    ];
    
    var fewItems = [
        { id: 2, name: 'item2' }
    ];
    
    var keys = Object.keys( fewItems[0] ) 
    
    var result = allItems.filter( 
      function(item){ 
        for( var k = fewItems.length-1; k>=0; --k){ 
          var dontWant = fewItems[k]; 
          var i=keys.length-1; 
          for( ; i>=0; --i ){ 
            if( dontWant[keys[i]] != item[keys[i]]){  break; } 
          } 
          if( i == -1){ return false;} 
        } 
        return true; 
      }
    );

    console.log(result)

answered Oct 23, 2017 at 17:49

Nick Timmer

4252 silver badges13 bronze badges

Comments

shawon191 · Accepted Answer · 2017-10-23 17:51:57Z

1

Pure JS solution

var allItems = [
  { id: 1, name: 'item1' },
  { id: 2, name: 'item2' },
  { id: 3, name: 'item3' }
];

var fewItems = [
  { id: 2, name: 'item2' }
];

var result3 = allItems
  .filter(item => {
    for(let restrictedItem of fewItems) {
      if (JSON.stringify(restrictedItem) === JSON.stringify(item)) {
        return false;
      }
    }
    return true;
  })

console.log(result3);

answered Oct 23, 2017 at 17:51

shawon191

1,96516 silver badges28 bronze badges

Comments

Sajeetharan · Accepted Answer · 2017-10-23 18:13:58Z

1

var allItems = [
    { id: 1, name: 'item1' },
    { id: 2, name: 'item2' },
    { id: 3, name: 'item3' }
];

var fewItems = [
    { id: 2, name: 'item2' }
];

var result3 = _(allItems) 
        .differenceBy(fewItems, 'id', 'name')
        .map(_.partial(_.pick, _, 'id', 'name'))
        .value();

console.log(result3);

<script src='https://cdn.jsdelivr.net/lodash/4.17.2/lodash.min.js'></script>

EDIT

Without Lodash

var allItems = [
    { id: 1, name: 'item1' },
    { id: 2, name: 'item2' },
    { id: 3, name: 'item3' }
];

var fewItems = [
    { id: 2, name: 'item2' }
];


var props = ['id', 'name'];
var result = allItems.filter(function(o1){
     return !fewItems.some(function(o2){
        return o1.id === o2.id;        
    });
}).map(function(o){
     return props.reduce(function(newo, name){
        newo[name] = o[name];
        return newo;
    }, {});
});

console.log(result);

edited Oct 23, 2017 at 18:13

answered Oct 23, 2017 at 17:24

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

3 Comments

Jeremy Belolo Over a year ago

Hey, thanks for this... But I don't like the idea of integrating lodash in an Angular app. I would really like to do it without, if at all possible.

Sajeetharan Over a year ago

@JeremyBelolo check the solution without lodash, edited answer

Nick Timmer Over a year ago

So you say it's an Angular app? so probably best to use Angular's Comparison methods for equality, since you don't wnat to use Lodash: docs.angularjs.org/api/ng/function/angular.equals I thought you put in original quesiton Angular but now it's gone.

Collectives™ on Stack Overflow

Filter out objects from another array in a loop

4 Answers 4

1 Comment

Comments

Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related