6

Simple I have an object that looks like this which is returned directly from a stored procedure in my chrome browser. How can I remove the ones that say null in javascript/angular 2?

Object

Grinish Nepal
  • 3,037
  • 3
  • 30
  • 49
CodeMan03
  • 570
  • 3
  • 18
  • 43

4 Answers4

9

null seems to be the only falsy values, so you could do just

arr = arr.filter(Boolean);

If it's just an object with keys, you could do

var obj = {c1 : 's', c2 : 's', c3 : null, c4 : null};

Object.entries(obj).forEach( o => (o[1] === null ? delete obj[o[0]] : 0));

console.log(obj);
adeneo
  • 312,895
  • 29
  • 395
  • 388
  • Why did you use `Boolean` instead of `el => el`? – Endenite Sep 22 '17 at 15:05
  • @HermanLauenstein I've never seen this either, but I suppose `Boolean` is there to cast whatever it gets into a `boolean` - truthy/falsy values. Since constructor is a function, you can pass it as an argument to `filter`. – Marian Sep 22 '17 at 15:18
  • Indeed, passing in `Boolean` will return the result of using the `Boolean` constructor on the values, and any falsy values, including `null` in this case, is filtered out. – adeneo Sep 22 '17 at 15:40
6

Use array filter:

var filtered = arr.filter(el => el !== null);

And even simpler (but this will filter other falsy values as well):

var filtered = arr.filter(el => el);
adriaan
  • 1,088
  • 1
  • 12
  • 29
Faly
  • 13,291
  • 2
  • 19
  • 37
  • This doesn't seem to work I am using let filtered :any[] = dataObj.Errors[0].LineList.filter(el => el !== null); It isn't removing those values that are null. Its still the same exact list. Should I do a splice? – CodeMan03 Sep 22 '17 at 15:30
  • You should note that there is a difference between the 2 methods in some cases. what i want to say is that the 2 lines is not the same (in some other cases). so. you need to take care when using them. – Mohamed Abbas Sep 22 '17 at 15:52
6

The image that you attach in your question is for an object not an array

Read this question answers to know the difference between them.

To remove all null values from an array:

You can use Array#filter method

Ex:

const arr = [1, "a", null, "name", null, 100];
const newArr = arr.filter( e =>   e !== null);

console.log(newArr); // [1, "a", "name", 100]

To remove all properties with a nullvalue from an object:

You can use Array#filter , Array#reduce and Object#keys methods

Ex:

const obj = {a: 1, b: "name", c: null, d: 100, e: null};
const newObj = Object.keys(obj)
               .filter(e => obj[e] !== null)
               .reduce( (o, e) => {
                    o[e]  = obj[e]
                    return o;
               }, {});
                      

console.log(newObj); // {"a": 1,"b": "name", "d": 100 }

To remove all properties from an object inside array of objects:

You can combine all of the previous methods in addition to Array#map method.

Ex:

const arrOfObjects = [
    {a: null, b: "name", c: null, d: 100, e: "name"},
    {f: 1, g: null, h: 23, i: null, j: null},
    {k: null, l: "name", m: null, n: 100, o: "name"}
]

const newArrOfObjects = arrOfObjects
    .map(
        obj => 
        Object.keys(obj).filter(e => obj[e] !== null)
        .reduce((o, e) => {o[e]  = obj[e]; return o;}, {})
    )

console.log(newArrOfObjects)
Grinish Nepal
  • 3,037
  • 3
  • 30
  • 49
Mohamed Abbas
  • 2,228
  • 1
  • 11
  • 19
3

First of all you don't have an array according to your provided image. It's an object and everyone thought you have an array due to your misguided title. So you can not use filter function right away. You can do something like this to filter the object.

var object = {
  C1: "123456",
  C2: "1234",
  C3: null,
  C4: null,
  C5: null,
  C6: "4567"
}

var MAP = {
  C1: "Product",
  C2: "Product Description",
  C3: "Date",
  C4: "",
  C5: "",
  C6: "Date"
}

for (var key in object) {
  if (object[key] === null) {
    delete object[key];
  } else {
    object[MAP[key]] = object[key];
    delete object[key];
  }
}

console.log(object);

UPDATE

I updated your answer to cater extra needs. Keep in mind that the MAP object should have a one to one mapping with key and value.

Thusitha
  • 3,393
  • 3
  • 21
  • 33