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
   }
]

first you must parse JSON to an object, because JSON is simply a string and you can't do much with it — Jaromanda X
– Jaromanda X, Commented Jul 17, 2017 at 5:07
Buddy, you should at least give it a try, SO is not a free code writing service. That being said, explain your expected output properly. On what basis do you want to remove the object. — Shubham Khatri
– Shubham Khatri, Commented Jul 17, 2017 at 5:10

Vineesh · Accepted Answer · 2017-07-17 05:46:53Z

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);

Alexandre GUIDET · Accepted Answer · 2017-07-17 05:43:07Z

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.

Shubham Khatri · Accepted Answer · 2017-07-17 05:56:07Z

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);

Collectives™ on Stack Overflow

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

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related