Javascript using filter/includes on an array of objects

Question

What is the best way to filter out data that exists within an object?

I was able to do use the below code when data was just an array of values but now I need to filter out any data where the item.QID exists in my array of objects.

Data Obj:

var data = [{
  QID: 'ABC123',
  Name: 'Joe'
},
{
 QID: 'DEF456',
 Name: 'Bob
}]

Snippet:

// I don't want to include data if this QID is in my object
this.employees = emp.filter(item =>!this.data.includes(item.QID));

From what I understand, includes only works on an array so I need to treat all of the QID values in my object as an array.

Desired Outcome: (assuming item.QID = ABC123)

this.employees = emp.filter(item =>!this.data.includes('ABC123'));

Result:

var data = [{
  QID: 'DEF456',
  Name: 'Bob'
}]

UPDATE: Apologies, I left some things a little unclear trying to only include the necessary stuff.

// People Search
    this.peopleSearchSub = this.typeahead
        .distinctUntilChanged()
        .debounceTime(200)
        .switchMap(term => this._mapsService.loadEmployees(term))
        .subscribe(emp => {
            // Exclude all of the current owners
            this.employees = emp.filter((item) => item.QID !== this.data.QID);
        }, (err) => {
            this.employees = [];
        });

The above code is what I am working with. data is an object of users I want to exclude from my type-ahead results by filtering them out.

@guest271314- I added a little more context around what I left out — SBB
– SBB, Commented Oct 18, 2017 at 22:20

CRice · Accepted Answer · 2017-10-18 22:20:02Z

5

The question is a little ambiguous, but my understanding (correct me if I'm wrong), is that you want to remove all items from a list emp that have the same QID as any item in another list data?

If that's the case, try:

this.employees = emp.filter(item => !this.data.some(d => d.QID === item.QID))

some is an array method that returns true if it's callback is true for any of the arrays elements. So in this case, some(d => d.QID === item.QID) would be true if ANY of the elements of the list data have the same QID as item.

answered Oct 18, 2017 at 22:20

CRice

32.6k5 gold badges63 silver badges75 bronze badges

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

Comments

charlietfl · Accepted Answer · 2017-10-18 22:10:42Z

0

Try Object#hasOwnProperty()

this.employees = emp.filter(item =>item.hasOwnProperty('QID'));

edited Oct 18, 2017 at 22:10

answered Oct 18, 2017 at 22:08

charlietfl

172k14 gold badges125 silver badges154 bronze badges

5 Comments

guest271314 Over a year ago

OP is checking for a specific value at the property

charlietfl Over a year ago

@guest271314 not what is stated.... " any data where the item.QID exists". Might be mis-worded ... was my interpretation anyway

guest271314 Over a year ago

Granted, though see next line "Desired Outcome: (assuming item.QID = ABC123)" and expected result

charlietfl Over a year ago

yeah...question is ambiguous

guest271314 Over a year ago

Another issue with Question is where emp is defined.

Jay Hamilton · Accepted Answer · 2017-10-18 22:31:23Z

0

You can use a for ... in to loop through and filter out what you want:

const data = [{
    QID: 'ABC123',
    Name: 'Joe'
},
 {
   QID: 'DEF456',
   Name: 'Bob'
 }]

let newData     = [];
let filterValue = 'ABC123';

for (let value in data) {
  if (data[value].QID !== filterValue) {
    newData.push(data[value]);
  }
}

newData will be your new filtered array in this case

answered Oct 18, 2017 at 22:31

Jay Hamilton

1145 bronze badges

Comments

gavgrif · Accepted Answer · 2017-10-19 00:12:37Z

You can use an es6 .filter for that. I also added a couple of elements showing the filtered list and an input to allow changing of the filtered value. This list will update on the click of the button.

const data = [{
    QID: 'ABC123',
    Name: 'Joe'
},
 {
   QID: 'DEF456',
   Name: 'Bob'
 }]

displayData(data);

function displayData(arr) {
  let str = '';
  document.getElementById('filterList').innerHTML = '';

  arr.forEach((i) => { str += "<li>" + i.QID + ": " + i.Name + "</li>"})
  document.getElementById('filterList').innerHTML = str;
}

function filterData() {
let filterValue = document.getElementById('filterInput').value;
filterText (filterValue);
}


function filterText (filterValue) {
  let newArr = data.filter((n) => n.QID !== filterValue); 
  displayData(newArr)
}

<input id="filterInput" type="text" value="ABC123" />
<button type ="button" onclick="filterData()">Filter</button>
<hr/>
<ul id="filterList"><ul>

Collectives™ on Stack Overflow

Javascript using filter/includes on an array of objects

4 Answers 4

Comments

5 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

5 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related