Spread syntax ES6 with statement

Question

I tried to write ternary operator with spread syntax and copy two objects. Is it possible to use ternary operator with spread syntax inside with literal objects? My code works okay, I just want to optimize it.

hintStyle: disabled ? {...globalStyles.hint, ...globalStyles.hintDisabled} : globalStyles.hint,

I want to write like this:

hintStyle: {...globalStyles.hint, {disabled ? ...globalStyles.hintDisabled : {}}},

Does it work? If not, do you get errors? If so, what errors? What's the question you're asking? — StudioTime, Jul 19 '17 at 08:15
My first code works , how to use spread es6 operator with ternary operator inside. The error is 'Unexpected token' — Palaniichuk Dmytro, Jul 19 '17 at 08:18
don't you need a spread operator before `{disabled ? ...globalStyles.hintDisabled : {}}` — danielspaniol, Jul 19 '17 at 08:22
Rest spread is transpiled to Object.assign invocation, which certainly can be written in form with conditional argument applying — Vladislav Ihost, Jul 19 '17 at 08:25

score 54 · Accepted Answer · answered Jul 19 '17 at 08:27

54

Spread is not an operator, it's part of the object literal syntax (or at least it will be when the proposal is accepted). You need to write

{...globalStyles.hint, ...(disabled ? globalStyles.hintDisabled : {})},

answered Jul 19 '17 at 08:27

Bergi

630,263
148
957
1,375

What if you only want to spread in one case bot not in the other? Lets say string vs array is the check. – The Fool Sep 30 '20 at 16:46
1

@TheFool You can only spread an object into an object. If you have a value that is not an object, how do you want to make it part of the object? – Bergi Sep 30 '20 at 20:31
you can spread one array into another or you can just add another item – The Fool Sep 30 '20 at 23:43
@TheFool This question is not about arrays though. Do *you* use array spread syntax? – Bergi Sep 30 '20 at 23:53

score 1 · Answer 2 · answered Sep 07 '21 at 23:08

I ran into this same problem today, my use case was simple enough that I could do this:

// given any-typed parameters a and b, I want to append b to a
// if a is iterable, I want to use spread.
// Initially I had:

const fn1 = (a, b) => [Symbol.iterator in a ? ...a : a, b]

// This was my solution:

const fn2 = (a, b) => Symbol.iterator in a ? [...a, b] : [a, b];

Spread syntax ES6 with statement

2 Answers2

Linked

Related