Based on one array object keys and other array object values create one more new array?

Question

I have two arrays like this

    arr1 = [  
   {  
      'name':'Victoria Cantrell',
      'position':'Integer Corporation',
      'office':'Croatia',
      'ext':'0839',
      'startDate':'2015-08-19',
      'salary':208.178
   },
   {  
      'name':'Pearleeee',
      'position':'In PC',
      'office':'Cambodia',
      'ext':'8262',
      'startDate':'2014-10-08',
      'salary':114.367
   },
   {  
      'name':'Pearl Crosby',
      'position':'Integer',
      'office':'Cambodia',
      'ext':'8162',
      'startDate':'2014-10-08',
      'salary':114.367
   }
]

arr2 = 

[{
  'name': 'name',
  'checkfilter': false
},
{
  'name': 'position',
  'checkfilter': true
},
{
  'name': 'office',
  'checkfilter': true
},
{
  'name': 'startDate',
  'checkfilter': false
},
{
  'name': 'ext',
  'checkfilter': false
},
{
  'name': 'salary',
  'checkfilter': false
}]

based on checkfilter== true i want produce third array like this

arr3 = `

[{
  name: 'position',
  values: [{
    checkName: 'Integer Corporation'

  },
  {
    checkName: 'In PC'

  },
  {
    checkName: 'Integer'

  }]
},

{ 
 name:'office',
  values: [{
    checkName: 'Croatia'

  },
  {
    checkName: 'Cambodia'

  }]
}
]

` I tried to solve this scenario like this, but its not working perfect

    arr3=[]
      this.arr2.forEach((column: any) => {
      if (column.ischeckFilter === true) {
        this.arr3.push({
          name: column.name,
          values: []
        });
      }
    });

 this.arr1.forEach((d: any) => {
      this.arr2.forEach((column: any) => {
        if (column.ischeckFilter === true) {
        this.arr3.forEach((c: any) => {
         // console.log(d[column.name], c.name, 'JJJJ');
         // console.log(Object.keys(d), 'BBBBBBBBB');
          let keys = Object.keys(d);
          keys.forEach((k: any) => {
            if (k === c.name) {
              if (find( c.values, { 'checkName': d[column.name]}) === undefined) {
                c.values.push({
                  checkName: d[column.name] ,
                  ischeck: false
                });
              }

            }
          });

      });
    }
      });
    });
    console.log( this.arr3)
  }

the output array values should not contain any duplicate, I used for each loops, is there any best practices to solve this scenario like decresing the loops, because above arrays length is somuch, if i use more loops it's incresing the loading time, so please let me know how to solve this issue smartly

Thanks in advance

Andrzej Smyk · Accepted Answer · 2017-09-28 12:45:22Z

Fairly easy with use of standard map, filter and reduce:

var arr1 = [{  
  'name':'Victoria Cantrell',
  'position':'Integer Corporation',
  'office':'Croatia',
  'ext':'0839',
  'startDate':'2015-08-19',
  'salary':208.178
 }, {  
  'name':'Pearleeee',
  'position':'In PC',
  'office':'Cambodia',
  'ext':'8262',
  'startDate':'2014-10-08',
  'salary':114.367
}, {  
  'name':'Pearl Crosby',
  'position':'Integer',
  'office':'Cambodia',
  'ext':'8162',
  'startDate':'2014-10-08',
  'salary':114.367
}];

const arr2 = [{
  'name': 'name',
  'checkfilter': false
},{
  'name': 'position',
  'checkfilter': true
},{
  'name': 'office',
  'checkfilter': true
},{
  'name': 'startDate',
  'checkfilter': false
},{
  'name': 'ext',
  'checkfilter': false
},{
  'name': 'salary',
  'checkfilter': false
}];

const isDuplicate = (arr, name) => !arr.find(({ checkname }) => checkname === name);
const arr3 = arr2
  .filter(({ checkfilter  }) => checkfilter)
  .map(({ name }) => ({
    name: name,
    values: arr1.reduce((names, item) =>  isDuplicate(names, item[name]) ?
      [...names, { checkname: item[name] } ] : names, [])
}));

console.log(arr3);

ahmetugurbulut · Accepted Answer · 2017-09-28 12:46:39Z

1

function createArr3(target, source) {
    for (var prop in source) {
        if (source[prop]["checkfilter"]) {
            var newArr3Element = {};
            newArr3Element.name = source[prop].name;
            newArr3Element.values = [];
            target.forEach(function(element) {
                if (newArr3Element.values.indexOf(element[source[prop].name]) < 0){
                    newArr3Element.values.push(element[source[prop].name]);
                }
            });
            arr3.push(newArr3Element);
        }
    }    
    console.log(arr3);
}

https://jsfiddle.net/x6140nct/

answered Sep 28, 2017 at 12:46

ahmetugurbulut

1,60911 silver badges25 bronze badges

Comments

Keith · Accepted Answer · 2017-09-28 12:56:35Z

1

First lets filter our arr2.

var x = arr2.filter((r) => r.checkfilter).

Our Name gets mapped..

map((r) => ({name:r.name,

Get our matching values., and also remove duplicates.

values:([...new Set(arr1.map((x) => (x[r.name])))]).

Finally remap, so we get {checkName: ?}

map((r) => ({checkName:r}))

Lets not forget to close the brackets & stuff..

}));

const arr1 = [  
   {  
      'name':'Victoria Cantrell',
      'position':'Integer Corporation',
      'office':'Croatia',
      'ext':'0839',
      'startDate':'2015-08-19',
      'salary':208.178
   },
   {  
      'name':'Pearleeee',
      'position':'In PC',
      'office':'Cambodia',
      'ext':'8262',
      'startDate':'2014-10-08',
      'salary':114.367
   },
   {  
      'name':'Pearl Crosby',
      'position':'Integer',
      'office':'Cambodia',
      'ext':'8162',
      'startDate':'2014-10-08',
      'salary':114.367
   }
];

const arr2 = 

[{
  'name': 'name',
  'checkfilter': false
},
{
  'name': 'position',
  'checkfilter': true
},
{
  'name': 'office',
  'checkfilter': true
},
{
  'name': 'startDate',
  'checkfilter': false
},
{
  'name': 'ext',
  'checkfilter': false
},
{
  'name': 'salary',
  'checkfilter': false
}];

var x = arr2.filter((r) => r.checkfilter).
  map((r) => ({name:r.name, 
    values:([...new Set(arr1.map((x) => (x[r.name])))]).
      map((r) => ({checkName:r}))
  }));
  
console.log(x);

edited Sep 28, 2017 at 12:56

answered Sep 28, 2017 at 12:34

Keith

24.4k2 gold badges32 silver badges48 bronze badges

8 Comments

Runali Over a year ago

Here what is Set

Keith Over a year ago

developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… In ES5 days, we might have used an object literal {x:true, y:true}, but with SET's you can leave out the true.. There is more to it than that, one major advantage is sets can also store any type/value as key.

Runali Over a year ago

is this feauture available es6, because i am using es6, and getting error

Keith Over a year ago

Yes, available in ES6,. As you can see it works in the Snippet. What error you getting, are you using a really horrible browser like IE :)

Keith Over a year ago

LOL, I even enabled the Babel compilier in Snippet, and IE blew it's brains out. Edge is fine though. What piece of **** Microsoft once had a monopoly on.

|

Collectives™ on Stack Overflow

Based on one array object keys and other array object values create one more new array?

3 Answers 3

Comments

Comments

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related