Remove key-value pair from JSON object (React-Native js)?

Question

   [  
   {  
      id:265,
      leaveType:{  
         id:1,
         name:'Casual Leave'
      },
      currentProject:'parlo,',
      initialDate:'2017-07-06',
      finalDate:'2017-07-06',
      workingDays:1,
      employee:{  
         id:211,
         name:'appu'
      },
      actionItems:[  
         {  
            id:2,
            name:'APPROVE'
         },
         {  
            id:3,
            name:'REJECT'
         },
         {  
            id:4,
            name:'CANCEL'
         }
      ],
      halfDay:false
   },
   {  
      id:277,
      leaveType:{  
         id:1,
         name:'Casual Leave'
      },
      currentProject:'Venon,',
      initialDate:'2017-07-03',
      finalDate:'2017-07-04',
      workingDays:2,
      employee:{  
         id:206,
         name:'malya'
      },
      actionItems:[  
         {  
            id:2,
            name:'APPROVE'
         },
         {  
            id:3,
            name:'REJECT'
         },
         {  
            id:4,
            name:'CANCEL'
         }
      ],
      halfDay:false
   },
   {  
      id:285,
      leaveType:{  
         id:1,
         name:'Casual Leave'
      },
      currentProject:'ferrar,',
      initialDate:'2017-09-25',
      finalDate:'2017-09-25',
      workingDays:1,
      employee:{  
         id:68,
         name:'Geena'
      },
      actionItems:[  
         {  
            id:2,
            name:'APPROVE'
         },
         {  
            id:3,
            name:'REJECT'
         },
         {  
            id:4,
            name:'CANCEL'
         }
      ],
      halfDay:false
   },
   {  
      id:286,
      leaveType:{  
         id:1,
         name:'Casual Leave'
      },
      currentProject:'ole,',
      initialDate:'2017-09-26',
      finalDate:'2017-09-26',
      workingDays:1,
      employee:{  
         id:68,
         name:'harry'
      },
      actionItems:[  
         {  
            id:2,
            name:'APPROVE'
         },
         {  
            id:3,
            name:'REJECT'
         },
         {  
            id:4,
            name:'CANCEL'
         }
      ],
      halfDay:false
   }
]

The above is a simple json array please suggest me a loop to remove the below part of json array.The below object has to be completely removed from the array.I am working on a react-native project so the code has to be in react js.

     {  
        id:4,
        name:'CANCEL'
     }

My expected output is given below

[  
   {  
      id:265,
      leaveType:{  
         id:1,
         name:'Casual Leave'
      },
      currentProject:'parlo,',
      initialDate:'2017-07-06',
      finalDate:'2017-07-06',
      workingDays:1,
      employee:{  
         id:211,
         name:'appu'
      },
      actionItems:[  
         {  
            id:2,
            name:'APPROVE'
         },
         {  
            id:3,
            name:'REJECT'
         }
      ],
      halfDay:false
   },
   {  
      id:277,
      leaveType:{  
         id:1,
         name:'Casual Leave'
      },
      currentProject:'Venon,',
      initialDate:'2017-07-03',
      finalDate:'2017-07-04',
      workingDays:2,
      employee:{  
         id:206,
         name:'malya'
      },
      actionItems:[  
         {  
            id:2,
            name:'APPROVE'
         },
         {  
            id:3,
            name:'REJECT'
         }
      ],
      halfDay:false
   },
   {  
      id:285,
      leaveType:{  
         id:1,
         name:'Casual Leave'
      },
      currentProject:'ferrar,',
      initialDate:'2017-09-25',
      finalDate:'2017-09-25',
      workingDays:1,
      employee:{  
         id:68,
         name:'Geena'
      },
      actionItems:[  
         {  
            id:2,
            name:'APPROVE'
         },
         {  
            id:3,
            name:'REJECT'
         }
      ],
      halfDay:false
   },
   {  
      id:286,
      leaveType:{  
         id:1,
         name:'Casual Leave'
      },
      currentProject:'ole,',
      initialDate:'2017-09-26',
      finalDate:'2017-09-26',
      workingDays:1,
      employee:{  
         id:68,
         name:'harry'
      },
      actionItems:[  
         {  
            id:2,
            name:'APPROVE'
         },
         {  
            id:3,
            name:'REJECT'
         }
      ],
      halfDay:false
   }
]

Answer 1

This is a simple solution using for loop.

  var json = [ { id:265, leaveType:{ id:1, name:'Casual Leave' }, currentProject:'parlo,', initialDate:'2017-07-06', finalDate:'2017-07-06', workingDays:1, employee:{ id:211, name:'appu' }, actionItems:[ { id:2, name:'APPROVE' }, { id:3, name:'REJECT' }, { id:4, name:'CANCEL' } ], halfDay:false }, { id:277, leaveType:{ id:1, name:'Casual Leave' }, currentProject:'Venon,', initialDate:'2017-07-03', finalDate:'2017-07-04', workingDays:2, employee:{ id:206, name:'malya' }, actionItems:[ { id:2, name:'APPROVE' }, { id:3, name:'REJECT' }, { id:4, name:'CANCEL' } ], halfDay:false }, { id:285, leaveType:{ id:1, name:'Casual Leave' }, currentProject:'ferrar,', initialDate:'2017-09-25', finalDate:'2017-09-25', workingDays:1, employee:{ id:68, name:'Geena' }, actionItems:[ { id:2, name:'APPROVE' }, { id:3, name:'REJECT' }, { id:4, name:'CANCEL' } ], halfDay:false }, { id:286, leaveType:{ id:1, name:'Casual Leave' }, currentProject:'ole,', initialDate:'2017-09-26', finalDate:'2017-09-26', workingDays:1, employee:{ id:68, name:'harry' }, actionItems:[ { id:2, name:'APPROVE' }, { id:3, name:'REJECT' }, { id:4, name:'CANCEL' } ], halfDay:false } ] ; for(var i =0;i<json.length;i++){ actionItems = json[i].actionItems; for(var j =0;j<actionItems.length;j++){ if(actionItems[j].name === 'CANCEL'){ json[i].actionItems.splice(j,1); } } } console.log(json); 

Answer 2

You could map over the outer array and then filter the item based on the actionItem name property

 var data = [ { id:265, leaveType:{ id:1, name:'Casual Leave' }, currentProject:'parlo,', initialDate:'2017-07-06', finalDate:'2017-07-06', workingDays:1, employee:{ id:211, name:'appu' }, actionItems:[ { id:2, name:'APPROVE' }, { id:3, name:'REJECT' }, { id:4, name:'CANCEL' } ], halfDay:false }, { id:277, leaveType:{ id:1, name:'Casual Leave' }, currentProject:'Venon,', initialDate:'2017-07-03', finalDate:'2017-07-04', workingDays:2, employee:{ id:206, name:'malya' }, actionItems:[ { id:2, name:'APPROVE' }, { id:3, name:'REJECT' }, { id:4, name:'CANCEL' } ], halfDay:false }, { id:285, leaveType:{ id:1, name:'Casual Leave' }, currentProject:'ferrar,', initialDate:'2017-09-25', finalDate:'2017-09-25', workingDays:1, employee:{ id:68, name:'Geena' }, actionItems:[ { id:2, name:'APPROVE' }, { id:3, name:'REJECT' }, { id:4, name:'CANCEL' } ], halfDay:false }, { id:286, leaveType:{ id:1, name:'Casual Leave' }, currentProject:'ole,', initialDate:'2017-09-26', finalDate:'2017-09-26', workingDays:1, employee:{ id:68, name:'harry' }, actionItems:[ { id:2, name:'APPROVE' }, { id:3, name:'REJECT' }, { id:4, name:'CANCEL' } ], halfDay:false } ] var newData = data .map((ele)=>{ let newElement = Object.assign({}, ele); newElement.actionItems = newElement.actionItems.filter(actionItem => actionItem.name !== 'CANCEL'); return newElement }) console.log(newData); 

Answer 3

First, you will need to determine the matching index in your array. It look like you will need two loop as you are searching through an array of items.

Once you have located the part to remove, just use Array.splice(index, 1) to completely remove the key from your array.

let's say you want to remove this part

{  
    id:4,
    name:'CANCEL'
}

from all the actionItems attribute of your sub objects. Start by looping through your collection of objects, then loop through your collection of actions

for (let i = 0; i < yourMainArray.length; i++) {
  let indexToDelete = -1
  for (let j = 0; j < yourMainArray[i].actionItems.length; j++) {
    if (yourMainArray[i].actionItems[j].name === 'CANCEL') {
      indexToDelete = j
    }
  }
  if (indexToDelete !== -1) {
    yourMainArray[i].actionItems.splice(indexToDelete, 1)
  }
}

As you will want to modify an array while looping on it at the same time, you need to hold a reference of the index to delete and delete the item outside of your loop.