Remove Object From Array if the value is empty in name and value pair js

Question

[{name: "mode", value: "1"},{name: "group", value: ""},{name: "from_date", value: ""},{name: "to_date", value: "2018-10-16"},{name: "action", value: "ac_filter_transactions"}

This is how my array looks like. I want to remove the name and value pair from the array if the value is empty.

I tried this solution: but this didn't work

formData.map((i) => {
  (i.value == "") ? delete i: "";
});

I know this is a simple question but I couldn't find any relevant example to solve this problem. All examples and solutions I found was for this type of object

let obj = {"firstname": "XYZ", "lastname": "ABC"}

What are the difference between both the objects?

Answer 1

You can use Array.prototype.filter and return entries based on a boolean of whether or not the value exists since an empty string is falsy.

a.filter(o => (o.value));

 let a = [{name: "mode", value: "1"},{name: "group", value: ""},{name: "from_date", value: ""},{name: "to_date", value: "2018-10-16"},{name: "action", value: "ac_filter_transactions"}]; let result = a.filter(o => (o.value)); console.log(result); 

Note : If the any of your value properties are also falsy, they won't be picked up either. To get around this you could simply rewrite it using: (o.value !== "")

 let a = [{name: "mode", value: "1"},{name: "group", value: ""},{name: "from_date", value: ""},{name: "to_date", value: "2018-10-16"},{name: "action", value: "ac_filter_transactions"}]; let result = a.filter(o => (o.value !== "")); console.log(result); 

Answer 2

For your question title I assume "remove" means mutate the array (change its actual content). If it is so you can do it like this:

const copy = arr.slice(); // copy of array for iterating without getting the index (`i`) wrong
let count = 0;
copy.forEach((val, i) => { if (!val.value) arr.splice(i - count++, 1); });
                      // maybe `val.value != ""` instead of `!val.value` ?

Demo:

 var arr = [{name: "mode",value: "1"}, {name: "group", value: ""}, {name: "from_date",value: ""}, {name: "to_date", value: "2018-10-16"}, {name: "action",value:"ac_filter_transactions"}]; const copy = arr.slice(); let count = 0; copy.forEach((val, i) => { if (!val.value) arr.splice(i - count++, 1); }); console.log(arr); // print original array, not a copy 

---

Or if you do not want to mutate the array (do not change its actual content) then you can just make a (filtered) copy of it like this:

const copy = arr.filter(val => !!val.value)

Demo:

 var arr = [{name: "mode",value: "1"}, {name: "group", value: ""}, {name: "from_date",value: ""}, {name: "to_date", value: "2018-10-16"}, {name: "action",value:"ac_filter_transactions"}]; console.log(arr.filter(val => !!val.value)); // print a copy, not the original array 

Answer 3

Array.map will return the same number of items in a new array. So, you would need to use Array.reduce instead.

formData.reduce((result, item) => {
  if (item.value) {
    result.push(item);
  }

  return result;
}, []);