Compare two arrays and filter them javascript

Question

Basically i have two arrays which i am using it for the configuration of buttons.

First array which defines how many buttons should be present and in order.

buttonGroups: [ 0, 2 ]

Another array of objects which says about the actual buttons.

    buttons = [
    {
        buttonLabel: 'label1',
        cond1: true,
        cond2: false
    },
    {
        buttonLabel: 'label2',
        cond1: true,
        cond2: false
    },
    {
        buttonLabel: 'label3',
        cond1: false,
        cond2: true
    }
];

The buttonGroups is the configuration array. If it has only [0, 1] then first two buttons will exist. If buttonGroups has only [0, 3] we should have first and third button exists in buttons array.

This is what i have tried

buttonGroups.map((payload1, index1) => {
    buttons .map((payload2, index2) => {
        if(index1 === index2){
            //Display Here only the matched index from ButtonGroups
            console.log(payload2)
        }
    })
})

This is giving the first index button array. How to get the matched array buttons?

Shiladitya · Accepted Answer · 2020-03-23 06:58:14Z

2

Here you go with a solution

var buttonGroups = [ 0, 2 ];


var buttons = [
  {
    buttonLabel: 'label1',
    cond1: true,
    cond2: false
  },
  {
    buttonLabel: 'label2',
    cond1: true,
    cond2: false
  },
  {
    buttonLabel: 'label3',
    cond1: false,
    cond2: true
  }
];

var filteredButtons = buttonGroups.map(item => {
  return buttons[item];
});

console.log(filteredButtons);

filteredButtons will return the filtered buttons which you can render.

answered Mar 23, 2020 at 6:58

Shiladitya

12.2k17 gold badges29 silver badges43 bronze badges

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

Comments

IVIosi · Accepted Answer · 2020-03-23 06:59:45Z

1

You can iterate over buttonGroups and get result:

buttonGroups.map(button => {return buttons[button]})

answered Mar 23, 2020 at 6:59

IVIosi

4974 silver badges10 bronze badges

Comments

uiTeam324 · Accepted Answer · 2020-03-23 07:03:11Z

0

Use filter method.

const filterBtn = buttons.filter((btn,index) => buttonGroups.includes(index));

answered Mar 23, 2020 at 7:03

uiTeam324

1,25515 silver badges34 bronze badges

1 Comment

HMR Over a year ago

That would be in the wrong order. buttonGroups also indicates the order of the buttons, try your code with buttonGroups being [3,1]. The solution is much simpler and is: buttonGroups.map((i) => buttons[i])

Collectives™ on Stack Overflow

Compare two arrays and filter them javascript

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related