Handle an Action in the Store about twice assignment

JavaScript
1

when I remove {login: true} in Object.assign, it said that login not true.
I don’t understand why I have to assign twice true to login.


> const defaultState = {
>   login: false
> };
> 
> const reducer = (state = defaultState, action) => {
>   // change code below this line
> 
>      if(action.type ==='LOGIN'){
>     let newState = Object.assign({login: true},  defaultState);
>     newState.login =true;
>     return newState;
>   }
>   else
>   {
>     return state;
>   }
> 
> 
> 
>   
>   // change code above this line
> };
> 
> const store = Redux.createStore(reducer);
> 
> const loginAction = () => {
>   return {
>     type: 'LOGIN'
>   }
> };

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/front-end-libraries/redux/handle-an-action-in-the-store

2

Because defaultState is {login: false}.
When you use Object.assign you’re setting up a variable ‘login’ set to true, then you overwrite that variable with the value false ( Object assign overwrite the properties with the same value);
Just do it once ( set login to true) and will be fine, there will be no need of the variable declaration since you can return directly the object with the correct value^^

3

Thank you!
but when i remove {login: true}.
the code like this

const defaultState = {
  login: false
};

const reducer = (state = defaultState, action) => {
  // change code below this line
if(action.type ==='LOGIN'){
    let newState = Object.assign( defaultState);
    newState.login =true;
    return newState;
  }   
  else   
  {
    return state;
  }
  // change code above this line
};

const store = Redux.createStore(reducer);

const loginAction = () => {
  return {
    type: 'LOGIN'
  }
};

there is a error message:
Dispatching loginAction should update the login property in the store state to true.

4

Ah, you’re crashing again against the Object.assign function :stuck_out_tongue:
I mean, if you use this code:

if(action.type ==='LOGIN'){
    let newState = Object.assign( defaultState);
    console.log('1',newState);
    newState.login =true;
    console.log('2',newState);
    return newState;
  }

you’ll notice that the output is correct ({login:true}) but something in the code confuse the test check.

Object assign ( reference: MDN - Objet.assign() ) is used to have at least two arguments, a source and a target ( it assign the property of the source(s) to the target. I’ve never seen it used with just one argument so I can’t say what’s wrong ( apparently nothing ) but if you use that method appropriately ( Object.assign( {}, defaultState) the test will pass :slight_smile:

That said, I was suggesting you to return just the action: if you want you can check the code here ( yours is fine but I think this could make more clear what return action means):

if(action.type ==='LOGIN'){
    return {login: true}
  } else {
    return state;
  }
5

Thank you very much!
I understand now!
it is because I use Object.assign wrong.

Object.assign(target, …sources)
Yes, I checked it again, it needs at least and only two arguments.

by the way, how you can see the log in console? the freecodeCamp don’t show log.

Thanks!

1 Like
6

Usually ctrl + shift + I will open the console (the browser one).

I found out that if you use that combination while focus is into the challenge window ( where you type the code ) it doesn’t work for me: I have to take out the focus ( just click in another part of the screen ): anyway this happen to me, I didn’t tested for other browser / system so if the same problem will occur to you just try that ^^

7

Thank you very much, because I just new to web developer.

I copy all the code in console, but the result is an error:
VM81:17 Uncaught ReferenceError: Redux is not defined
at :17:15

I hope I can see the log too!

8

Oh, i think there was a misunderstanding ^^
You should keep writing your code in the challenge editor, it’s only the result of ( console.log(‘stuff’) ) that appear into the browser console ^^
Here is a screenshot:

Screenshot%20from%202018-06-15%2014-09-31
Screenshot%20from%202018-06-15%2014-09-311920×855 138 KB

1 Like
9

Oh, I never know that, you are so clever!
Thanks!
I think I just have a hard time in something, but your message at this moment comforting me a lot!
And it’s funny, I never thought when I run code in freecodecamp and open the console to see the result.

it’s a good technique!

1 Like