How to add items to array based on conditional

Question

Instead of doing a nested conditional, is there a cleaner more efficient way of achieving this:

if option === 3, add both the nearbyLocations and recentSearches object to array
if option == 1, add only the recentSearches
else (or option === 2), add only nearbyLocations object

See below for my code. Thank you!

const results = option === 3 ? [...state.nearbyLocations, ...recentSearches] : option === 1 ? [...recentSearches] : [...state.nearbyLocations]

Is option really a string, and can it have only those three values? Would 0 be a valid value as well? — Bergi
– Bergi, Commented Jan 23, 2019 at 22:12
Perhaps Switch might be something you want to take a look it if you don't want nested conditionals. — user5283119
– user5283119, Commented Jan 23, 2019 at 22:13
I updated the code above so that option is an integer. There is a 0 or Default value where I'd like to return empty array [] — Mike
– Mike, Commented Jan 23, 2019 at 22:14
IMO never use nested conditionals. Use switches of if statements to preserve readability — Andrew Li
– Andrew Li, Commented Jan 23, 2019 at 22:15
@Mike Good, my answer does just that :-) The code in your question didn't consider the 0 case correctly. — Bergi
– Bergi, Commented Jan 23, 2019 at 22:15

Bergi · Accepted Answer · 2019-01-23 22:19:31Z

2

You could use multiple spread elements that depending on the options contribute a value to the result or not:

const results = [
    ...(option === 3 || option === 2 ? state.nearbyLocations : []),
    ...(option === 3 || option === 1 ? recentSearches : []),
];

or with bit masks - as that is what your options essentially match - do

const results = [
    ...(option & 0b10 ? state.nearbyLocations : []),
    ...(option & 0b01 ? recentSearches : []),
];

edited Jan 23, 2019 at 22:19

answered Jan 23, 2019 at 22:14

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

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

8 Comments

Mike Over a year ago

Why are you adding the spread operator to ...option? The spread operator is for ...state.nearbyLocations

Bergi Over a year ago

@Mike The spread syntax encompasses the whole ternary expression. I'll use parenthesis to make it more clear, but they are not necessary.

Mike Over a year ago

Ah nice - this works perfectly. Much cleaner than what I had originally. Thank you!

Tymek Over a year ago

Awwww. Exacly what I would suggest. When answer isn't clear, ask different question (what is the situation when I add ...). Please, don't use bitmap - bad practice! ...unless it's code golf :)

Bergi Over a year ago

@Tymek Why do you think bitmaps are a bad practice? Because few people understand bitwise operations? Imo they're perfect for this and probably even how option was designed - as per the OP, for a value of 0 nothing should be returned, for 1 the one, for 2 the other, and for 3 both. It's not hard to discover the pattern :-)

|

Bergi · Accepted Answer · 2019-01-23 22:56:11Z

0

In this situation, it's better to use a switch statement:

var results = [];
switch (option) {
    case 3:
        results.push(...state.nearbyLocations, ...recentSearches);
        break;
    case 1:
        results.push(...recentSearches);
        break;
    case 2:
        results.push(...state.nearbyLocations);
        break;
}

edited Jan 23, 2019 at 22:56

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

answered Jan 23, 2019 at 22:25

Jack Bashford

44.3k11 gold badges56 silver badges84 bronze badges

3 Comments

Bergi Over a year ago

Did you mean to use spread syntax for the method call? You shouldn't need apply, and you shouldn't need array literals.

Jack Bashford Over a year ago

@Bergi I'm sorry, that's how I believed the OP wanted it pushed to the array. How should I best do this? Feel free to edit my answer with the correct syntax if you feel the need.

Bergi Over a year ago

Ok done, now it should be equivalent to what the OP was doing :-)

Collectives™ on Stack Overflow

How to add items to array based on conditional

2 Answers 2

8 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related