Removing key in a JSON object but want to keep the original

Question

I am trying to delete a key in variable a. However, i still want to keep the original variable value for another purpose. But somehow its alway overwrite the initial a.

This is the code that i wrote:

 let a = [
          { firstName: 'Tony', lastName: 'Stack' },
          { firstName: 'Iron', lastName: 'Man' }
        ];

        console.log('before',a);
        delete a[0].firstName;
        console.log('after',a);

Output:

I am expecting the first console.log will be printing out the initial value.

It's just confuse myself. I feel like i must have missed some knowledge here. Appreciate for any help. Thanks

score 1 · Answer 1 · answered May 02 '19 at 23:15

Well your question has two parts. First, the console.log showing the same value before and after. What happens is, Chrome's console doesn't like to keep track of complicated data like objects. So, when you log the variables with the console closed, Chrome will only remember the variable. Then, when you open the console it will read that variable and display it in the logs. However, if you leave the console open and refresh the page you should see the correct values being printed.

The second part, storing the object to use it for later, requires something known as deep cloning. Here is the reason why that is required and here is a post detailing how to do it.

score 1 · Answer 2 · answered May 02 '19 at 23:17

Your code is working correctly. Refer here for a full answer. You can verify your answer by logging the firstName instead of the whole object.

 let a = [
          { firstName: 'Tony', lastName: 'Stack' },
          { firstName: 'Iron', lastName: 'Man' }
        ];

        console.log('before',a[0].firstName);
        delete a[0].firstName;
        console.log('after',a[0].firstName);

score 1 · Answer 3 · answered May 03 '19 at 00:43

1

     let a = [
              { firstName: 'Tony', lastName: 'Stark' },
              { firstName: 'Iron', lastName: 'Man' }
            ];

      let b= {...a} // use spread operator to clone an array

            console.log('before',a);
            delete b[0].firstName;
            console.log('after',b);

answered May 03 '19 at 00:43

dota2pro

7,220
7
44
79

I still got the same thing. The 'a' variable got affected after delete b[0].firstName. I feel like the code is actually working but somehow its acting weird. cause, i am using 'a' and 'b' for different purpose, but its never work cause it got effected at the same time. – daniel8x May 03 '19 at 20:19
are you doing b ={...a} or b =a ? – dota2pro May 03 '19 at 20:28
i am using b = {...a}. – daniel8x May 03 '19 at 21:35
using map and operator seems like does the work. but still not sure the way i have been doing not working. @@ – daniel8x May 03 '19 at 21:36

score 1 · Accepted Answer · answered May 03 '19 at 01:10

1

You can use map and spread operator like below

let a = [
          { firstName: 'Tony', lastName: 'Stack' },
          { firstName: 'Iron', lastName: 'Man' }
        ];
        
let removed = a.map(({firstName, ...lastName}) => lastName);

console.log('before:',a)
console.log('after:', removed)

answered May 03 '19 at 01:10

Hien Nguyen

24,551
7
52
62

Thanks. I made it works. I think i need to really need to know about how to use map, reduce, filter and spread operator. But still dont understand why the program that i provided in the question not working as expected. 'a' is always the same. – daniel8x May 03 '19 at 21:34

Removing key in a JSON object but want to keep the original

4 Answers4