Javascript – How can I build a sentence to display data based on whether data values are > 0?

I am getting back data from an API – just an object with numerical values pertaining to each key – and then building a simple sentence to display the data for the user. However, I only want to include a value from the data if it is bigger than 0. Here is an example with mock data:

let data = {red: 100, blue: 200, yellow: 0, green: 400};

let resultsSentence = `We found ${data.red} red posts, ${data.blue} blue posts, and ${data.green} green posts.`

console.log(resultsSentence)

As you can see, I left yellow out from the results sentence because it has a value of 0. Of course, I need to be able to generate this sentence dynamically based on whatever data is returned. If I use conditionals, it will be a mess, since there are too many possible scenarios (writing 15 if/else statements does not seem like a good approach).

How can I handle this? I need to generate the sentence based on whichever values are > 0. At first I thought, easy, I’ll just push all the values into an array, check for 0’s, and remove any items that are equal to 0 from the array. Then, build the sentence based on however long the array is, i.e., if the array length is 3, then refer to each value as array[0], array[1], array[2]. However, this presents a problem, since I need to be able to clarify which values are which in the sentence. For example, if I remove yellow from the array, the array length will be 3, but I won’t know which value was removed.

Can anyone help me come up with an efficient solution for this?

>Solution :

You can use a simple for..of loop to iterate over the object’s keys and values, building up your string inside of it.

This does result in an oxford comma but you can strip that in the conditional (where you choose to use and instead).

let data = {red: 100, blue: 200, yellow: 0, green: 400};
let res = 'We found '

// Keep a record of how many keys we've processed so we know when we're at the end
let i = 1
for (const [k, v] of Object.entries(data)) {
  // we could just continue early here, but we want to keep adding to `i`
  if (v > 0) { 
    // This is the last key so use `and` not a comma
    if (i === Object.keys(data).length) {
      res += `and ${v} ${k} posts.`
    } else {
      res += `${v} ${k} posts, `
    }
  }
  i++
}

console.log(res)