How to filtering array of objects to another array of objects in javascript?

I have got two arrays of objects . I want to filtering data based on PermissionObj.

This is coming form database. Here is arrays of sub-arrays in the permissionObj .

    const PermissionObj = {
     permission: [{
       "books": [{
        "label": "Can View",
        "value": "can_view"
       }]
      },
      {
       "Journals": [{
         "label": "Can View",
         "value": "can_view"
        },
        {
         "label": "Can Create",
         "value": "can_create"
        },
       ]
      },
      {
       "deal": [{
         "label": "Can update",
         "value": "can_update"
        },
        {
         "label": "Can delete",
         "value": "can_delete"
        },
       ]
      }
     ]
    }

this is static data. I want to compare this data based on PermissionObj.

const data = [{
  label: "books",
  value: "can_view"
 },
 {
  label: "deal",
  content: [{

   value: "can_update"
  }, {
   value: "can_delete"
  },{value:"can_view"}]
 },
 {
  label: "Articles",

 },
 {
  label: "Journals",
  content: [{
    value: "can_create"
   },
   {
    value: "can_view"
   },
  {
    value: "can_delete"
   },
 {
    value: "can_edit"
   },

  ]
 }
]

I am trying filter data array of object based on PermissionObj array of objects . here is my trying code.

let permission = PermissionObj.permission 

permission.filter(item=>{
  // I am finding data label by using permission label.

 let dataItem = data.find(index=>item[index.label])

 console.log(dataItem)

})

  // the problem is that I want to filtering based on value .

  // if both of value is true , then show the data .

if PermissionObj value will be matched with data value . then show the data .
My accepted Output would be this format :

const data = [{
  label: "books",
  value: "can_view"
 },
 {
  label: "deal",
  content: [{
   value: "can_update"
  }, {
   value: "can_delete"
  }]
 },
 {
  label: "Journals",
  content: [{
    value: "can_create"
   },
   {
    value: "can_view"
   },


  ]
 }
]

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

First build keys from PermissionObj. Use filter on data array which label includes in keys.

const PermissionObj = {
  permission: [
    {
      books: [
        {
          label: "Can View",
          value: "can_view"
        }
      ]
    },
    {
      Journals: [
        {
          label: "Can View",
          value: "can_view"
        },
        {
          label: "Can Create",
          value: "can_create"
        }
      ]
    },
    {
      deal: [
        {
          label: "Can update",
          value: "can_update"
        },
        {
          label: "Can delete",
          value: "can_delete"
        }
      ]
    }
  ]
};

const data = [
  {
    label: "books",
    value: "can_view"
  },
  {
    label: "deal",
    content: [
      {
        value: "can_update"
      },
      {
        value: "can_delete"
      }
    ]
  },
  {
    label: "Articles"
  },
  {
    label: "Journals",
    content: [
      {
        value: "can_create"
      },
      {
        value: "can_view"
      }
    ]
  }
];

const perm = {};
PermissionObj.permission.forEach(item =>
  Object.entries(item).forEach(([key, values]) => {
    perm[key] = values.map(x => x.value);
  })
);

const updated = data
  .map(item => {
    const newItem = {
      ...item
    };
    if (item.content) {
      newItem.content = item.content.filter(x =>
        perm[item.label].includes(x.value)
      );
    } else if (item.value) {
      newItem.value = perm[item.label].includes(item.value) ? item.value : "";
    }
    return newItem;
  })
  .filter(x => x.content || x.value);

console.log(updated);

Method 2

so you can get keys of the permission array, this would give you an array of keys.since you are getting the keys of an item in an array of objects so the key would always be the first item then you can check each data item with that key

const PermissionObj = {
    permission: [
      {
        books: [
          {
            label: "Can View",
            value: "can_view"
          }
        ]
      },
      {
        Journals: [
          {
            label: "Can View",
            value: "can_view"
          },
          {
            label: "Can Create",
            value: "can_create"
          }
        ]
      },
      {
        deal: [
          {
            label: "Can update",
            value: "can_update"
          },
          {
            label: "Can delete",
            value: "can_delete"
          }
        ]
      }
    ]
  };

  const data = [
    {
      label: "books",
      value: "can_view"
    },
    {
      label: "deal",
      content: [
        {
          value: "can_update"
        },
        {
          value: "can_delete"
        }
      ]
    },
    {
      label: "Articles"
    },
    {
      label: "Journals",
      content: [
        {
          value: "can_create"
        },
        {
          value: "can_view"
        }
      ]
    }
  ];
  
    let permission = PermissionObj.permission;
    let NewData = [];
    permission.filter(item => {
      let ObjectKeys = Object.keys(item);
      let ObjKey = ObjectKeys[0];
      let DATA = data.find(
        dataItem => dataItem.label.toString() === ObjKey.toString()
      );
      NewData.push(DATA);
    });
    console.log(NewData);


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x