Refine object array by applying multiple filters based on various values

Question

Refine object array by applying multiple filters based on various values

Currently, I have an array of objects that I need to filter based on user input. For example, if a user enters "Red Shirt," I want to only return entries with values like

{color: "red", clothingType: "shirt"}

rather than

{color: "red", clothingType: "scarf"}
// or 
{color: "blue", clothingType: "shirt"}

I am hoping to create a generic solution that can be easily adapted for other scenarios, such as searching for "John Smith" in objects like

{firstName:"John", lastName:"Smith"},

Is there a straightforward way to implement this overall filter without requiring the user to specify color and clothing type separately, or is that impossible?

Currently, my approach involves retrieving the value of "data[key]" and using "includes" to check if "red" or "shirt" exist in the object individually. However, I am unsure how to search for multiple values simultaneously.

javascript json search filter

Answer 1

Answer №1

Here is a simple code snippet that may be helpful:

const input = "John K. Smith";
const data = [
  { firstName: "Carl", lastName: "Gauss" },
  { firstName: "John", lastName: "Smith" },
  { firstName: "Elon", lastName: "Musk" },
  { firstName: "John", lastName: "Kennedy" },
  { firstName: "Adam", lastName: "Smith" }
];

console.log(
  data.filter((obj) =>
    Object.values(obj).every((value) => input.includes(value))
  )
);

Answer 2

Here is a simple code snippet that may be helpful:

const input = "John K. Smith";
const data = [
  { firstName: "Carl", lastName: "Gauss" },
  { firstName: "John", lastName: "Smith" },
  { firstName: "Elon", lastName: "Musk" },
  { firstName: "John", lastName: "Kennedy" },
  { firstName: "Adam", lastName: "Smith" }
];

console.log(
  data.filter((obj) =>
    Object.values(obj).every((value) => input.includes(value))
  )
);

Refine object array by applying multiple filters based on various values

Answer №1

Similar questions

Exploring the process of implementing functions on buttons in Three.js

Deciphering click event parameters in an AngularJS application

Launch a modal window that displays a form generated using ngx-formly, which is nested within another form also created with

I am unable to organize an array

The Angular 1.5 directive utilizes one-way binding to seamlessly update the parent scope

Converting a JSON object into an array with JQ

Encountering a problem with AngularJS - receiving the [ng:areq] error, for more information visit http://errors.angularjs.org/1.3.2/ng/areq

Looking to display an alert message upon scrolling down a specific division element in HTML

npm ERROR: Unable to install the package named "<packageName>" because it conflicts with an existing package of the same name

Obtain value of dropdown selection upon change

Executing a Python function on a server from a local machine with the help of AngularJS

Is it possible in Elasticsearch to dynamically construct and send a JSON query object?

Is there a way to retrieve a collection of files with a particular file extension by utilizing node.js?

The .each function in JavaScript is creating conflicts with other classes on the webpage

include the ReactToastify.css file in your project using the import statement

Scope challenges with making multiple rest calls in Angular.js

How Can You Create a Sliding List Animation (Up/Down) Using Angular and Twitter-Bootstrap?

What is the process for a client to determine the data type of a JSON RestResponse?

Discover the Practical Utility of Maps beyond Hash Tables in Everyday Life

What is the best way to trigger an AJAX function every 15 seconds?