How to filter Nested Array using Key in JavaScript ? Last Updated : 05 Feb, 2024 Comments Improve Suggest changes Like Article Like Report Filtering a nested array in JavaScript involves the process of selectively extracting elements from an array of objects, where each object contains another array. We will discuss how can we filter Nested Array using the key in JavaScript. Filtering a nested array based on a key in JavaScript can be done using various methods: Table of Content Using filter methodUsing reduce methodUsing map and filterUsing filter methodThe filter method is used to filter the main array based on a condition specified using the same method. The same method checks if at least one element in the nested array meets the given condition. This method directly filters the objects in the main array based on the specified key and value. Example: This example shows the filtering of a nested array using the key by using the filter method. JavaScript // data taken const data = [ { id: 1, items: [{ name: 'item1' }, { name: 'item2' }] }, { id: 2, items: [{ name: 'item3' }, { name: 'item4' }] }, { id: 3, items: [{ name: 'item5' }, { name: 'item6' }] } ]; const keyToFilter = 'name'; const valueToFilter = 'item3'; const filteredData = data.filter(obj => obj.items.some(item => item[keyToFilter] === valueToFilter)); console.log(JSON.stringify(filteredData, null, 2)); Output[ { "id": 2, "items": [ { "name": "item3" }, { "name": "item4" } ] } ] Using reduce methodThe reduce() method is applied in this approach to iteratively build a new array that contains only the objects meeting the specified condition. The filter method is used to filter the items in the nested array, and the result is added to the accumulator array. Example: This example shows the filtering of nested array using the key by using the reduce method. JavaScript const data = [ { id: 1, items: [{ name: 'item1' }, { name: 'item2' }] }, { id: 2, items: [{ name: 'item3' }, { name: 'item4' }] }, { id: 3, items: [{ name: 'item5' }, { name: 'item6' }] } ]; const keyToFilter = 'name'; const valueToFilter = 'item3'; const filteredData = data.reduce((acc, obj) => { const filteredItems = obj.items.filter(item => item[keyToFilter] === valueToFilter); if (filteredItems.length > 0) { acc.push({ ...obj, items: filteredItems }); } return acc; }, []); console.log(JSON.stringify(filteredData, null, 2)); Output[ { "id": 2, "items": [ { "name": "item3" } ] } ] Using map and filterThe map and filter methods to achieve the desired result. First, the map method is used to iterate over each object in the main array. Then, the filter method is applied to the nested array within each object, isolating only the items that match the specified key and value. Example: This example shows the filtering of a nested array using the key by using the map and filter method. JavaScript const data = [ { id: 1, items: [{ name: 'item1' }, { name: 'item2' }] }, { id: 2, items: [{ name: 'item3' }, { name: 'item4' }] }, { id: 3, items: [{ name: 'item5' }, { name: 'item6' }] } ]; const keyToFilter = 'name'; const valueToFilter = 'item3'; const filteredData = data.map(obj => ({ ...obj, items: obj.items.filter(item => item[keyToFilter] === valueToFilter) })).filter(obj => obj.items.length > 0); console.log(JSON.stringify(filteredData, null, 2)); Output[ { "id": 2, "items": [ { "name": "item3" } ] } ] Comment More infoAdvertise with us Next Article How to filter Nested Array using Key in JavaScript ? J jaykush Follow Improve Article Tags : JavaScript Web Technologies Similar Reads How to Filter an Array in JavaScript ? The array.filter() method is used to filter array in JavaScript. The filter() method iterates and check every element for the given condition and returns a new array with the filtered output.Syntaxconst filteredArray = array.filter( callbackFunction ( element [, index [, array]])[, thisArg]);Note: I 2 min read How to use map() filter() and reduce() in JavaScript? The map(), filter(), and reduce() are the array functions that allow us to manipulate an array according to our logic and return a new array after applying the modified operations on it. 1. JavaScript map() MethodThe map() method in JavaScript is used to create a new array by applying a function to 2 min read How to filter nested objects in JavaScript? The filter() method creates a new array with all elements that pass the test implemented by the provided function. Below are the approaches used to filter nested objects in JavaScript: Table of Content Using filter() methodUsing some() method Method 1: Using filter() method Example: This approach us 2 min read How to Get a List of Array Keys in JavaScript? Here are the different methods to get a list of associative array keys in JavaScript1. Using JavaScript for each loopIn this method, traverse the entire associative array using a for each loop and display the key elements of the array. javascriptlet a = {Newton: "Gravity",Albert: "Energy",Edison: "B 3 min read How to filter out the non-unique values in an array using JavaScript ? In JavaScript, arrays are the object using the index as the key of values. In this article, let us see how we can filter out all the non-unique values and in return get all the unique and non-repeating elements. These are the following ways by which we can filter out the non-unique values in an arra 4 min read How to remove object from array of objects using JavaScript ? Removing an object from an array of objects in JavaScript refers to the process of eliminating a specific object from the array based on certain conditions, like matching a property value. This task is common in data manipulation, ensuring the array only contains the desired elements.There are two a 2 min read How to get the Value by a Key in JavaScript Map? JavaScript Map is a powerful data structure that provides a convenient way to store key-value pairs and retrieve values based on keys. This can be especially useful when we need to associate specific data with unique identifiers or keys.Different Approaches to Get the Value by a Key in JavaScript Ma 3 min read How to Convert Object to Array in JavaScript? In this article, we will learn how to convert an Object to an Array in JavaScript. Given an object, the task is to convert an object to an Array in JavaScript. Objects and Arrays are two fundamental data structures. Sometimes, it's necessary to convert an object to an array for various reasons, such 4 min read How to map, reduce and filter a Set element using JavaScript ? The map(), reduce() and filter() are array functions that transform the array according to the applied function and return the updated array. They are used to write simple, short and clean codes for modifying an array instead of using the loops. map() method: It applies a given function on all the e 2 min read How to get a key in a JavaScript object by its value ? To get a key in a JavaScript object by its value means finding the key associated with a specific value in an object. Given an object with key-value pairs, you want to identify which key corresponds to a particular value, often for searching or data retrieval.How to get a key in a JavaScript object 4 min read Like