CODEWITHSUNDEEP
javascriptarrays
SBB
SBB

Reputation: 8970

Javascript using filter/includes on an array of objects

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.

Upvotes: 5

Views: 45412

Answers (4)

gavgrif
gavgrif

Reputation: 15499

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>

Upvotes: 0

Jay Hamilton
Jay Hamilton

Reputation: 114

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

Upvotes: 0

CRice
CRice

Reputation: 32166

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.

Upvotes: 5

charlietfl
charlietfl

Reputation: 171669

Try Object#hasOwnProperty()

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

Upvotes: 0

Related Questions