2

Trying to learn redux & react, currently digesting this tutorial: https://thinkster.io/tutorials/learn-redux/

Now, i found this code snippet

const defaultState = { checked: false };
const reducer = function(state = defaultState, action) {
  switch (action.type) {
    case 'TOGGLE':
      return { ...state, checked: !state.checked };
  }
  return state;
};
const store = createStore(reducer);

I need an explanation of this line: return { ...state, checked: !state.checked };.

What does the ...state do ? And is it a new feature of ECMA 2015 ??

Update

I don't think that this question is a duplicate of What does the three dots in react do?

The difference is that What does the three dots in react do? is about JSX spread attributes, while my question is about ECMAScript spread operator.

Well, not trying to be defensive but i think those two are different.

But somehow i get the answer for my question in What does the three dots in react do?

Thanks to mplungjan for pointing me to the latter question :)

Community
  • 1
  • 1
Bondan Sebastian
  • 718
  • 5
  • 16
  • 1
    Hi @mplungjan, thanks for pointing me to http://stackoverflow.com/questions/31048953/what-does-the-three-dots-in-react-do, but i think that my question is actually different from that one. Updated my question for better explanation :) – Bondan Sebastian Jan 28 '17 at 08:44
  • Apologies - you were doing react and the spread operator does the same in JSX and ES6 – mplungjan Jan 28 '17 at 08:47
  • `{ ...state, checked: !state.checked }` does the same as `Object.assign({}, state, { checked: !state.checked })` – connexo Jul 24 '20 at 19:51

0 Answers0