AR7 AR7 - 1 year ago 47
Javascript Question

What is ...!! syntax in ES6?

I was reading through this:

I know that

is being used as Object spread. I know that
is used to convert anything into a boolean with the same truthiness.

However knowing this what do they mean when they're put together like
? I have trouble understanding the last line here:

...isAction(rejected) ? rejected : {
...!!rejected && { payload: rejected }

  1. ...resolveAction
    just spreads the keys of

  2. ...isAction(rejected) ?
    will check if
    resolves an action and then will spread it. (Not sure about this one either)

  3. add
    to object if true

  4. {...!!rejected && { payload: rejected }

How is
even valid syntax? There are two options:

  1. If it spreads the object first, then
    would be applied to all the spread keys

  2. If
    is applied first it's a boolean value and it can't be spread.

So does it make no sense whatsoever, or am I missing something because given that code, I assume it's trying to spread a boolean value.

Answer Source

Okay so after downloading the npm module and going through the transpiled code I found the line:

return dispatch(isThunk(rejected) ? rejected.bind(null, resolveAction) : _extends({}, resolveAction, isAction(rejected) ? rejected : _extends({}, !!rejected && { payload: rejected })));

Of which the relevant part is here:

_extends({}, !!rejected && { payload: rejected })

Basically if !!rejected is true then it'll spread the payload into the object. If it's not _extends({}, false) just returns {}.

The key to this working is that ... has less precedence than any other operator in the entire line. With that in mind you can begin to make sense of it.