Unable to remove a key from JSON Array in ES6

user_1514543 0
Viewed 720

I'm writing a JS code in which I want to delete a specific key from JSON Array and my code is as below.

var obj = [
    {
        XXX: "2",
        YYY: "3",
        ZZZ: "4"
    },
    {
        XXX: "5",
        YYY: "6",
        ZZZ: "7"
    },
    {
        XXX: "1",
        YYY: "2",
        ZZZ: "3"
    }
];

for (var i = 0; i < obj.length; i++) {
    delete obj[i].YYY
}


/*obj=obj.forEach(item =>{ return delete item.YYYY});*/

console.log(obj);

This code works fine and is giving me the result as expected, but, When I try to run it using forEach (commented lines), it is showing me undefined.

Where am I going wrong?

javascript
5 Answers

Just remove the obj = part of your code. forEach always returns undefined. Since you're modifying the objects in your array and you want to replicate the for loop, forEach is fine, just don't reassign (and no need for return in the callback):

obj.forEach(item => { delete item.YYY; });

Live Example:

var obj = [
    {
        XXX: "2",
        YYY: "3",
        ZZZ: "4"
    },
    {
        XXX: "5",
        YYY: "6",
        ZZZ: "7"
    },
    {
        XXX: "1",
        YYY: "2",
        ZZZ: "3"
    }
];

obj.forEach(item => { delete item.YYY; });

console.log(obj);

(I removed the typo from the forEach code, you had an extra Y.)

That said, there's nothing wrong with a for loop, or you could use a for-of loop:

for (const item of obj
    delete item.YYY;
}

Live Example:

var obj = [
    {
        XXX: "2",
        YYY: "3",
        ZZZ: "4"
    },
    {
        XXX: "5",
        YYY: "6",
        ZZZ: "7"
    },
    {
        XXX: "1",
        YYY: "2",
        ZZZ: "3"
    }
];

for (const item of obj
    delete item.YYY;
}

console.log(obj);

Another alternative is to create a new array with new objects that don't have the YYY, via map and perhaps with destructuring:

obj = obj.map(({YYY, ...rest}) => rest);

Live Example:

let obj = [
    {
        XXX: "2",
        YYY: "3",
        ZZZ: "4"
    },
    {
        XXX: "5",
        YYY: "6",
        ZZZ: "7"
    },
    {
        XXX: "1",
        YYY: "2",
        ZZZ: "3"
    }
];

obj = obj.map(({YYY, ...rest}) => rest);

console.log(obj);

user_1572470

forEach doesn't return a value.

var obj = [{
    XXX: "2",
    YYY: "3",
    ZZZ: "4"
  },
  {
    XXX: "5",
    YYY: "6",
    ZZZ: "7"
  },
  {
    XXX: "1",
    YYY: "2",
    ZZZ: "3"
  }
];



obj.forEach(item => delete item.YYY);

console.log(obj);

If you don't want to mutate the original array, you can use Array.map:

var obj = [{
    XXX: "2",
    YYY: "3",
    ZZZ: "4"
  },
  {
    XXX: "5",
    YYY: "6",
    ZZZ: "7"
  },
  {
    XXX: "1",
    YYY: "2",
    ZZZ: "3"
  }
];



obj = obj.map(item => (delete item.YYY, item));

console.log(obj);

user_142512210

The Return value value of Array.prototype.forEach() is undefined, the actual object is modified. Also, you can shorter your code by removing the curly braces ({...}) and return keyword:

var obj = [
    {
        XXX: "2",
        YYY: "3",
        ZZZ: "4"
    },
    {
        XXX: "5",
        YYY: "6",
        ZZZ: "7"
    },
    {
        XXX: "1",
        YYY: "2",
        ZZZ: "3"
    }
];


obj.forEach(item => delete item.YYY);
console.log(obj);

user_74613810

forEach doesn't return a value. Any value returned in the callback given to forEach is going nowhere.

Don't do this with .map either, because delete is mutating the objects. Your approach with a for loop is the right one.

It would be different if you would want to avoid object mutation, and would like to create entirely new objects and put those in a new array. In that case .map() is the way to go:

let arr = [{XXX: "2",YYY: "3",ZZZ: "4"},{XXX: "5",YYY: "6",ZZZ: "7"},{XXX: "1",YYY: "2",ZZZ: "3"}];

let result = arr.map(({YYY, ...rest}) => rest);

console.log(result);

Here we isolate the YYY property with destructuring notation, collecting the other properties in rest, which is then the object you really want to have.

user_54598390

use obj.map instead of obj.forEach

user_132080130
Related