How to group array based on common value?

Question

I have data structure like below:

a : { active: true, key: "first", page: 1 },
b : { active: true, key: "second", page: 1 },
c : { active: true, key: "third", page: 2 },
d : { active: true , key: "fourth", page: 2 },
e : { active: false , key: "fifth", page: 3 },

From this data, first I need to find data with active status true then I need to create a new array containing sub array with same page number. I need something like this.

[
    ["first", "second"],
    ["third", "fourth"],
    ["fifth"]
]

What I have tried is:

let myArray = Object.entries(dashboardKeyConfiguration).filter(x => x[1]["active"]);

var groups = [];
        for (var i = 0; i < myArray.length; i++) {
            var groupName = myArray[i][1]["page"];
            if (!groups[groupName]) {
                groups[groupName] = [];
            }
            groups[groupName].push(myArray[i][1]["key"]);
        }
        myArray = [];
        console.log(groups);

It is inserting empty as first item like this:

(3) [empty, Array(2), Array(2)]

1) You're filtering out items that are not active, so why should "fifth" be included? 2) When I run the code, I see [null,["first","second"],["third","fourth"]]. Most likely you just need to subtract 1 from groupName (because array indexes start at zero). — p.s.w.g
– p.s.w.g, Commented Mar 13, 2019 at 4:14

Nouman Dilshad · Accepted Answer · 2019-03-13 07:13:22Z

2

What we can to is define the pageLength max number of pages we can have. Then we can loop from i to pageLength and search the object for the page and push it in the temp array. Once loop completes for a specific page push the temp array in the main array

const obj = {
        a : { active: true, key: "first", page: 1 },
        b : { active: true, key: "second", page: 1 },
        c : { active: true, key: "third", page: 2 },
        d : { active: true , key: "fourth", page: 2 },
        e : { active: false , key: "fifth", page: 3 },
        }
        let pageLength = 3;
        let array = [] ;
        
        for(let i = 1;i<=pageLength;i++){  
            temp = [];   
            for (var key in obj) {
                if (obj.hasOwnProperty(key)) {
                    let value = obj[key].key;
                    let page = obj[key].page;
                    if(page == i){    
                        temp.push(value);
                    } 
                }
            }
            array.push(temp) 
        }
        
        console.log(array)

It is just a raw logic. Keep in mind that the complexity for this can might be high and you could do it in a better way.

answered Mar 13, 2019 at 7:13

Nouman Dilshad

1,0901 gold badge14 silver badges17 bronze badges

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

1 Comment

Nouman Dilshad Over a year ago

if you want to check for status you can also do this let active = obj[key].active if(page == i && active==true)

Maheer Ali · Accepted Answer · 2019-03-13 04:37:40Z

1

This is because page starts from 1 Just subtract 1 from groupName

let obj = { a : { active: true, key: "first", page: 1 }, b : { active: true, key: "second", page: 1 }, c : { active: false, key: "third", page: 2 }, d : { active: false , key: "fourth", page: 2 }, e : { active: true , key: "fifth", page: 3 }} 


let myArray = Object.entries(obj).filter(x => x[1]["active"]);
var groups = [];
        for (var i = 0; i < myArray.length; i++) {
            var groupName = myArray[i][1]["page"]-1;
            if (!groups[groupName]) {
                groups[groupName] = [];
            }
            groups[groupName].push(myArray[i][1]["key"]);
        }
groups = groups.filter(x => x !== undefined)
console.log(groups)

edited Mar 13, 2019 at 4:37

answered Mar 13, 2019 at 4:19

Maheer Ali

36.5k8 gold badges53 silver badges83 bronze badges

8 Comments

user1687891 Over a year ago

let obj = { a : { active: true, key: "first", page: 1 }, b : { active: true, key: "second", page: 1 }, c : { active: false, key: "third", page: 2 }, d : { active: false , key: "fourth", page: 2 }, e : { active: true , key: "fifth", page: 3 }} when my data is like this it gives empty again'

Maheer Ali Over a year ago

That is because this time page:2 is excluded

Maheer Ali Over a year ago

You can filter() undefined in the end. I have edited

user1687891 Over a year ago

i still have empty in the middle

Maheer Ali Over a year ago

Its giving [ [ "first", "second" ], [ "fifth" ] ] in my console. Which browser you are using?

|

Shanti Swarup Tunga · Accepted Answer · 2019-03-13 07:52:18Z

1

Object.values(Object.keys(obj).reduce((acc,key)=>{
    if(obj[key].active) {if(acc[obj[key].page]) {acc[obj[key].page].push(obj[key].key)} else {acc[obj[key].page] = [obj[key].key]}}
        return acc
},{}))

We can reduce the object entries where the "active key is true" to an object

Object.keys(obj).reduce((acc,key)=>{
     if(obj[key].active) {if(acc[obj[key].page]) {acc[obj[key].page].push(obj[key].key)} else {acc[obj[key].page] = [obj[key].key]}}
        return acc
},{})

output:
{
    1:["first","second"],
    3:["fifth"]
}

We can take the values from this object

[["first","second"],["fifth"]]

For more info https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

edited Mar 13, 2019 at 7:52

answered Mar 13, 2019 at 5:08

Shanti Swarup Tunga

6413 silver badges13 bronze badges

1 Comment

Prakash Thete Over a year ago

Please provide some description along with code so that other people can easily understand your answer

Collectives™ on Stack Overflow

How to group array based on common value?

3 Answers 3

1 Comment

8 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

8 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related