Do not return null values in loop

Question

How to return only the image_url when few image_url maybe null?

var lineItems = [
  {
    description: "Packaging",
    image_url: null,
    ...
  },
  {
    description: "T-Shirt",
    image_url: <the-url-link>,
    ...
  }
]

In react:

...

lineItems.map(function(line){
  if (line.description !== "Packaging") {
    var img = line.image_url;
  }
  console.log(img);
});

...

I keep getting null along with the web links in the console. How to grab only the image_url that has the links. "Packaging" will never have an image_url link; it'll always be null.

do not use map in that way, it's just igrones your condition stackoverflow.com/questions/26716818/… — DanilGholtsman
– DanilGholtsman, Commented Sep 26, 2016 at 13:12

Sterling Archer · Accepted Answer · 2016-09-26 13:12:39Z

3

You can simply use a filter here to do that for you.

const nonNulls = lineItems.filter(item => item.image_url !== null);

This will filter out all the non-null values into a variable.

answered Sep 26, 2016 at 13:12

Sterling Archer

22.5k19 gold badges86 silver badges121 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Sylar Over a year ago

This method is returning objects, I only need the string urls.

Sterling Archer Over a year ago

You need to chain .map to it like Emil used. .map(obj => obj.image_url) and you're good.

Emil S. Jørgensen Over a year ago

@SterlingArcher Nice, short and to the point. Carefull with const and Lambda functions though if compatibility is an issue.

Emil S. Jørgensen · Accepted Answer · 2016-09-26 13:14:12Z

2

var data = [
  {
    url: null
  },
  {
    url: null
  },
  {
    url: '123'
  },
  {
    url: null
  }
]
console.log(
  data.filter(function (a) {
    return a.url != null
  }).map(function (a) {
    return a.url
  })
)

answered Sep 26, 2016 at 13:14

Emil S. Jørgensen

6,3891 gold badge17 silver badges30 bronze badges

Collectives™ on Stack Overflow

Do not return null values in loop

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related