Extract matching values from array of objects in javascript

Question

I have an array of objects and I am trying to create a filter where a user types few letters and gets the list of all the matching records.

users = [{office: "J Limited", contact: {first_name: "James", last_name: "Wilson", address: Canada}},{office: "Q Limited", contact: {first_name: "Quin", last_name: "Ross", address: Australia}},{office: "N Limited", contact: {first_name: "Nancy", last_name: "Mathew"}, address: "England"}]

I have a textfield where user types to get the results and lets suppose user types ja so the result should search fields office, contact first_name and last_name and if any such field contains matching letter should be the request like in this case the result output should be

J Limited, James, Wilson

Please help me achieve this.

Answer 1

To get the matching users, you can do something like:

const searchString = 'ja'

const matchingUsers = users.filter(user => 
  user.office.contains(searchString) || 
  user.contact.first_name.contains(searchString) || 
  user.contact.last_name.contains(searchString)
)

And then you can format that list of matching users however you like

EDIT: contains may not work on some JS versions (works on Chrome), so replace contains with includes :

const searchString = 'ja'

const matchingUsers = users.filter(user => 
  user.office.includes(searchString) || 
  user.contact.first_name.includes(searchString) || 
  user.contact.last_name.includes(searchString)
)

Answer 2

let users = [{
    office: "J Limited",
    contact: { first_name: "James", last_name: "Wilson", address: "Canada" }
}, {
    office: "Q Limited",
    contact: { first_name: "Quin", last_name: "Ross", address: "Australia" }
}, {
    office: "N Limited",
    contact: { first_name: "Nancy", last_name: "Mathew", address: "England"},
}];


// ig: i for case-insensitive, g for global
const regEx = new RegExp('ja', 'ig');

const result = users.filter(
    each =>
        each.office.match(regEx) ||
        each.contact.first_name.match(regEx) ||
        each.contact.last_name.match(regEx)
)
.map(
    each => [
        each.office,
        each.contact.first_name,
        each.contact.last_name
    ]
);

console.log(result);

Answer 3

You can loop through the array and search for objects.

 users = [{ office: "J Limited", contact: { first_name: "James", last_name: "Wilson", address: "Canada" } }, { office: "Q Limited", contact: { first_name: "Quin", last_name: "Ross", address: "Australia" } }, { office: "N Limited", contact: { first_name: "Nancy", last_name: "Mathew" }, address: "England" }, { office: "J Limited", contact: { first_name: "Jacob", last_name: "Wilson", address: "Canada" } } ] function search(searchKey) { searchKey = searchKey.toLowerCase(); results = []; for (var i = 0; i < users.length; i++) { if (users[i].contact.first_name.toLowerCase().includes(searchKey) || users[i].contact.last_name.toLowerCase().includes(searchKey) || users[i].office.toLowerCase().includes(searchKey)) { results.push(users[i]); } } return results; } var resultObject = search("ja"); if (resultObject) { for(i in resultObject){ console.log(resultObject[i].office, resultObject[i].contact.first_name, resultObject[i].contact.last_name) } }

Answer 4

const filterUser = users.filter(user =>{ return user.office.toLowerCase().includes((searchField).toLowerCase()) });

your searchField is the value of input and the filteruser can now be used as it will return the user with office name contain in the search or return all if nothing is enter in searchField.

You can now map through filterUser to be able to use the user contain the input value which is your searchField.