Javascript Spread Operator used with return

Question

I'm confused on how the spread operator is being used here. I have a basic understanding of how the spread operator works but I'm confused on what the spread operators are referring to, how it is being used, and what it is offering. The "userCanDecline" const is a boolean retrieved from an above call. Please let me know if I can provide any more information about what I've shared.

return [
 ...(userCanDecline
 ? [
 {
 label: 'Decline Draw',
 icon: 'ban',
 action: () => (el, ev) => {
 Service.decline(this.onCloseView);
 },
 },
 ]
 : [])

• epascarello: really no reason for it. should have just been written as return userCanDecline ? [{}] : [];
• RobG: There is no spread operator, there is spread syntax.
• decho: You have a return statement that returns an array. Then the spread syntax inside of it allows you to perform a check, if userCanDecline evaluates to true, it returns another array of objects, otherwise it returns an empty array. The ? and : is called conditional (ternary) operator. Also the wrapping parenthesis around (userCanDecline.....) aren't necessary.
• Barmar: The spread syntax is simply making a copy of the array returned by the conditional operator. But there's no need to make a copy of a freshly created array.
• Barmar: I'd say that this code was written by someone who didn't really know what he was doing. It's not a good example of anything.

Answer 1

Spread syntax can be used when all elements from an object or array need to be included in a list of some kind.

let arr1 = [0, 1, 2];
const arr2 = [3, 4, 5];
arr1 = [...arr1, ...arr2];

In your question, what's happening is that, userCanDeclined is checked if its value is true, if so, return an array in which the array below is spread(its values copied into the new returned array)

 [
 { 
 label: 'Decline Draw',
 icon: 'ban',
 action: () => (el, ev) => {
 Service.decline(this.onCloseView);
 },
 }
 ]

Else, spread or copy an empty array if false

 []

• Max Taylor-Hayden: This answer makes more sense than the comments left on the post. I'm not saying they're wrong, but after playing around with removing the "..." and some other syntax they suggested, the file isn't returning what's expected.
• Maye Edwin: Glad it made sense @MaxTaylor-Hayden