How to conditionally add props in javascript object reduce?

Question

following functions reduces an array and maps a new object.

getProps() {
  return this.items
            .reduce((map,props)=>
              ({...map, [props.name]: props.value, checked: true)})
            }), {})
}

What I want to achieve is that I want to conditionally add the checked property(key) if a condition is satisfied.

something like this.

 getProps() {
getProps() {
  return this.items
            .reduce((map, props)=>
              ( {...map
                , [props.name]: props.value
                , (props.required) ? checked: true : null
                
                  // which means that if props.required is true 
                  // then add checked: true 
                  // else do nothing (do not add checked)
  ,)})}), {})
}

EXP

what this means is that if props.required is true then add the property checked with value true (so that key:value pair checked:true will be added else do nothing (means do not add the key:value pair checked:true)

UPDATE

It is not about conditionally assign 'true' value to the checked property.
It is about to conditionally add checked property. Note the difference here...

Your code looks somewhat correct, the only thing weird is that it's probably better to do checked: props.required ? true : false — Trisma
– Trisma, Commented Aug 22, 2020 at 14:29
It is not to conditionally assign value to checked property. It is about to conditionally add checked property. Note the difference here... — mx_code
– mx_code, Commented Aug 22, 2020 at 14:31
Might be easier to slap a result.checked = this.items.some(props => props.required); on the end. — Bergi
– Bergi, Commented Aug 22, 2020 at 14:50

CertainPerformance · Accepted Answer · 2020-08-22 14:29:46Z

1

A simple if statement would do the trick:

getProps() {
  return this.items.reduce(
    (map, props) => {
      if (!props.checked) return map;
      return ({...map, [props.name]: props.value, checked: true });
    },
    {}
  );
}

or with the conditional operator:

getProps() {
  return this.items.reduce(
    (map, props) => props.checked
      ? map
      : ({...map, [props.name]: props.value, checked: true }),
    {}
  );
}

answered Aug 22, 2020 at 14:29

CertainPerformance

373k55 gold badges354 silver badges359 bronze badges

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

Comments

Sven.hig · Accepted Answer · 2020-08-22 15:15:30Z

1

I think you are after something like this

{ [props.name]: props.value, ...(props.required && { checked: true }) }

And this is the equivalent using the ternary operator

{ [props.name]: props.value, ...(props.required ? { checked: true } : {}) }

edited Aug 22, 2020 at 15:15

answered Aug 22, 2020 at 14:35

Sven.hig

4,5292 gold badges10 silver badges18 bronze badges

1 Comment

mx_code Over a year ago

wow this is a cool syntax. Can you share similar tricks? a like or something...

Collectives™ on Stack Overflow

How to conditionally add props in javascript object reduce?

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related