What does this.setState() call do in reactjs?
up vote
-2
down vote
favorite
I basically know what this.setState() is for but I'm wondering what the call of that construct is doing. There is an example within the documentations of reactjs which shows setState in action but I'm confused about the construct.
Here:
handleClick() {
this.setState(prevState => ({
isToggleOn: !prevState.isToggleOn
}));
}
Here is the full example: codepen
In my understanding the setState-function is called. As an argument there is arrow-function. But where does prevState came from?
javascript reactjs ecmascript-6
asked Nov 13 at 22:57
Marc M
5181623
add a comment |
up vote
-2
down vote
favorite
I basically know what this.setState() is for but I'm wondering what the call of that construct is doing. There is an example within the documentations of reactjs which shows setState in action but I'm confused about the construct.
Here:
handleClick() {
this.setState(prevState => ({
isToggleOn: !prevState.isToggleOn
}));
}
Here is the full example: codepen
In my understanding the setState-function is called. As an argument there is arrow-function. But where does prevState came from?
javascript reactjs ecmascript-6
asked Nov 13 at 22:57
Marc M
5181623
reactjs.org/docs/react-component.html#setstate
– Alexander Staroselsky
Nov 13 at 23:02
1
It might make more sense if you writethis.setState(function (previousState) { return { isToggleOn: !previousState.isToggleOn }; }). You can name the argument of the function whatever you see fit.
– Tholle
Nov 13 at 23:03
Yeah, that's a good complement. But I'm wondering where the value for previousState is going to come from. See my comment under @Quentin's answer
– Marc M
Nov 13 at 23:46
add a comment |
up vote
-2
down vote
favorite
up vote
-2
down vote
favorite
I basically know what this.setState() is for but I'm wondering what the call of that construct is doing. There is an example within the documentations of reactjs which shows setState in action but I'm confused about the construct.
Here:
handleClick() {
this.setState(prevState => ({
isToggleOn: !prevState.isToggleOn
}));
}
Here is the full example: codepen
In my understanding the setState-function is called. As an argument there is arrow-function. But where does prevState came from?
javascript reactjs ecmascript-6
asked Nov 13 at 22:57
Marc M
5181623
I basically know what this.setState() is for but I'm wondering what the call of that construct is doing. There is an example within the documentations of reactjs which shows setState in action but I'm confused about the construct.
Here:
handleClick() {
this.setState(prevState => ({
isToggleOn: !prevState.isToggleOn
}));
}
Here is the full example: codepen
In my understanding the setState-function is called. As an argument there is arrow-function. But where does prevState came from?
javascript reactjs ecmascript-6
javascript reactjs ecmascript-6
asked Nov 13 at 22:57
Marc M
5181623
asked Nov 13 at 22:57
Marc M
5181623
asked Nov 13 at 22:57
Marc M
5181623
asked Nov 13 at 22:57
Marc M
5181623
asked Nov 13 at 22:57
Marc M
5181623
5181623
reactjs.org/docs/react-component.html#setstate
– Alexander Staroselsky
Nov 13 at 23:02
1
It might make more sense if you writethis.setState(function (previousState) { return { isToggleOn: !previousState.isToggleOn }; }). You can name the argument of the function whatever you see fit.
– Tholle
Nov 13 at 23:03
Yeah, that's a good complement. But I'm wondering where the value for previousState is going to come from. See my comment under @Quentin's answer
– Marc M
Nov 13 at 23:46
add a comment |
reactjs.org/docs/react-component.html#setstate
– Alexander Staroselsky
Nov 13 at 23:02
1
It might make more sense if you writethis.setState(function (previousState) { return { isToggleOn: !previousState.isToggleOn }; }). You can name the argument of the function whatever you see fit.
– Tholle
Nov 13 at 23:03
Yeah, that's a good complement. But I'm wondering where the value for previousState is going to come from. See my comment under @Quentin's answer
– Marc M
Nov 13 at 23:46
reactjs.org/docs/react-component.html#setstate
– Alexander Staroselsky
Nov 13 at 23:02
reactjs.org/docs/react-component.html#setstate
– Alexander Staroselsky
Nov 13 at 23:02
1
1
It might make more sense if you write
this.setState(function (previousState) { return { isToggleOn: !previousState.isToggleOn }; }). You can name the argument of the function whatever you see fit.– Tholle
Nov 13 at 23:03
It might make more sense if you write
this.setState(function (previousState) { return { isToggleOn: !previousState.isToggleOn }; }). You can name the argument of the function whatever you see fit.– Tholle
Nov 13 at 23:03
Yeah, that's a good complement. But I'm wondering where the value for previousState is going to come from. See my comment under @Quentin's answer
– Marc M
Nov 13 at 23:46
Yeah, that's a good complement. But I'm wondering where the value for previousState is going to come from. See my comment under @Quentin's answer
– Marc M
Nov 13 at 23:46
add a comment |
1 Answer
1
active
oldest
votes
up vote
1
down vote
accepted
prevState is the name of an argument.
As with all arguments, their value is determined when the function is called, by the code which calls the function.
You are passing the function as an argument to setState.
You haven't included the source code to setState there, but it will be somewhere in or beyond that.
i.e. written by someone else.
You probably don't need to see that code. The documentation for setState should tell you what arguments will be passed to the callback function.
answered Nov 13 at 23:00
Quentin
635k718571026
Yeah but the question for me is: When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself. As far I understand, I'm passing a function definition which will be called before(!) setState is called to substitute the return value as the effective argument which is than gonna handle over as the real argument, so setState is going to get called with an Object-Literal as the argument right? So again: Where does the VALUE for prevState came from?
– Marc M
Nov 13 at 23:44
"When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself." — I stated that quite clearly: You haven't included the source code to setState there, but it will be somewhere in or beyond that.
– Quentin
Nov 13 at 23:45
1
"As far I understand, I'm passing a function definition which will be called before(!) setState is called" — No. I explained that too: "You are passing the function as an argument to setState.". You are passing the function. You are not calling the function and passing its return value.
– Quentin
Nov 13 at 23:46
"setState is going to get called with an Object-Literal as the argument right?" – Wrong. "You are passing the function as an argument to setState."
– Quentin
Nov 13 at 23:47
AH! Now I see. That was the point. Since I came from Java, passing a whole function instead of its return value to another function is still unexpected. Thanks for that! :)
– Marc M
Nov 13 at 23:49
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
1
down vote
accepted
prevState is the name of an argument.
As with all arguments, their value is determined when the function is called, by the code which calls the function.
You are passing the function as an argument to setState.
You haven't included the source code to setState there, but it will be somewhere in or beyond that.
i.e. written by someone else.
You probably don't need to see that code. The documentation for setState should tell you what arguments will be passed to the callback function.
answered Nov 13 at 23:00
Quentin
635k718571026
Yeah but the question for me is: When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself. As far I understand, I'm passing a function definition which will be called before(!) setState is called to substitute the return value as the effective argument which is than gonna handle over as the real argument, so setState is going to get called with an Object-Literal as the argument right? So again: Where does the VALUE for prevState came from?
– Marc M
Nov 13 at 23:44
"When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself." — I stated that quite clearly: You haven't included the source code to setState there, but it will be somewhere in or beyond that.
– Quentin
Nov 13 at 23:45
1
"As far I understand, I'm passing a function definition which will be called before(!) setState is called" — No. I explained that too: "You are passing the function as an argument to setState.". You are passing the function. You are not calling the function and passing its return value.
– Quentin
Nov 13 at 23:46
"setState is going to get called with an Object-Literal as the argument right?" – Wrong. "You are passing the function as an argument to setState."
– Quentin
Nov 13 at 23:47
AH! Now I see. That was the point. Since I came from Java, passing a whole function instead of its return value to another function is still unexpected. Thanks for that! :)
– Marc M
Nov 13 at 23:49
add a comment |
up vote
1
down vote
accepted
prevState is the name of an argument.
As with all arguments, their value is determined when the function is called, by the code which calls the function.
You are passing the function as an argument to setState.
You haven't included the source code to setState there, but it will be somewhere in or beyond that.
i.e. written by someone else.
You probably don't need to see that code. The documentation for setState should tell you what arguments will be passed to the callback function.
answered Nov 13 at 23:00
Quentin
635k718571026
Yeah but the question for me is: When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself. As far I understand, I'm passing a function definition which will be called before(!) setState is called to substitute the return value as the effective argument which is than gonna handle over as the real argument, so setState is going to get called with an Object-Literal as the argument right? So again: Where does the VALUE for prevState came from?
– Marc M
Nov 13 at 23:44
"When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself." — I stated that quite clearly: You haven't included the source code to setState there, but it will be somewhere in or beyond that.
– Quentin
Nov 13 at 23:45
1
"As far I understand, I'm passing a function definition which will be called before(!) setState is called" — No. I explained that too: "You are passing the function as an argument to setState.". You are passing the function. You are not calling the function and passing its return value.
– Quentin
Nov 13 at 23:46
"setState is going to get called with an Object-Literal as the argument right?" – Wrong. "You are passing the function as an argument to setState."
– Quentin
Nov 13 at 23:47
AH! Now I see. That was the point. Since I came from Java, passing a whole function instead of its return value to another function is still unexpected. Thanks for that! :)
– Marc M
Nov 13 at 23:49
add a comment |
up vote
1
down vote
accepted
up vote
1
down vote
accepted
prevState is the name of an argument.
As with all arguments, their value is determined when the function is called, by the code which calls the function.
You are passing the function as an argument to setState.
You haven't included the source code to setState there, but it will be somewhere in or beyond that.
i.e. written by someone else.
You probably don't need to see that code. The documentation for setState should tell you what arguments will be passed to the callback function.
answered Nov 13 at 23:00
Quentin
635k718571026
prevState is the name of an argument.
As with all arguments, their value is determined when the function is called, by the code which calls the function.
You are passing the function as an argument to setState.
You haven't included the source code to setState there, but it will be somewhere in or beyond that.
i.e. written by someone else.
You probably don't need to see that code. The documentation for setState should tell you what arguments will be passed to the callback function.
answered Nov 13 at 23:00
Quentin
635k718571026
answered Nov 13 at 23:00
Quentin
635k718571026
answered Nov 13 at 23:00
Quentin
635k718571026
answered Nov 13 at 23:00
Quentin
635k718571026
635k718571026
Yeah but the question for me is: When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself. As far I understand, I'm passing a function definition which will be called before(!) setState is called to substitute the return value as the effective argument which is than gonna handle over as the real argument, so setState is going to get called with an Object-Literal as the argument right? So again: Where does the VALUE for prevState came from?
– Marc M
Nov 13 at 23:44
"When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself." — I stated that quite clearly: You haven't included the source code to setState there, but it will be somewhere in or beyond that.
– Quentin
Nov 13 at 23:45
1
"As far I understand, I'm passing a function definition which will be called before(!) setState is called" — No. I explained that too: "You are passing the function as an argument to setState.". You are passing the function. You are not calling the function and passing its return value.
– Quentin
Nov 13 at 23:46
"setState is going to get called with an Object-Literal as the argument right?" – Wrong. "You are passing the function as an argument to setState."
– Quentin
Nov 13 at 23:47
AH! Now I see. That was the point. Since I came from Java, passing a whole function instead of its return value to another function is still unexpected. Thanks for that! :)
– Marc M
Nov 13 at 23:49
add a comment |
Yeah but the question for me is: When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself. As far I understand, I'm passing a function definition which will be called before(!) setState is called to substitute the return value as the effective argument which is than gonna handle over as the real argument, so setState is going to get called with an Object-Literal as the argument right? So again: Where does the VALUE for prevState came from?
– Marc M
Nov 13 at 23:44
"When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself." — I stated that quite clearly: You haven't included the source code to setState there, but it will be somewhere in or beyond that.
– Quentin
Nov 13 at 23:45
1
"As far I understand, I'm passing a function definition which will be called before(!) setState is called" — No. I explained that too: "You are passing the function as an argument to setState.". You are passing the function. You are not calling the function and passing its return value.
– Quentin
Nov 13 at 23:46
"setState is going to get called with an Object-Literal as the argument right?" – Wrong. "You are passing the function as an argument to setState."
– Quentin
Nov 13 at 23:47
AH! Now I see. That was the point. Since I came from Java, passing a whole function instead of its return value to another function is still unexpected. Thanks for that! :)
– Marc M
Nov 13 at 23:49
Yeah but the question for me is: When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself. As far I understand, I'm passing a function definition which will be called before(!) setState is called to substitute the return value as the effective argument which is than gonna handle over as the real argument, so setState is going to get called with an Object-Literal as the argument right? So again: Where does the VALUE for prevState came from?
– Marc M
Nov 13 at 23:44
Yeah but the question for me is: When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself. As far I understand, I'm passing a function definition which will be called before(!) setState is called to substitute the return value as the effective argument which is than gonna handle over as the real argument, so setState is going to get called with an Object-Literal as the argument right? So again: Where does the VALUE for prevState came from?
– Marc M
Nov 13 at 23:44
"When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself." — I stated that quite clearly: You haven't included the source code to setState there, but it will be somewhere in or beyond that.
– Quentin
Nov 13 at 23:45
"When Im passing the function as an argument, who is "providing""/filling" the argument of the function itself." — I stated that quite clearly: You haven't included the source code to setState there, but it will be somewhere in or beyond that.
– Quentin
Nov 13 at 23:45
1
1
"As far I understand, I'm passing a function definition which will be called before(!) setState is called" — No. I explained that too: "You are passing the function as an argument to setState.". You are passing the function. You are not calling the function and passing its return value.
– Quentin
Nov 13 at 23:46
"As far I understand, I'm passing a function definition which will be called before(!) setState is called" — No. I explained that too: "You are passing the function as an argument to setState.". You are passing the function. You are not calling the function and passing its return value.
– Quentin
Nov 13 at 23:46
"setState is going to get called with an Object-Literal as the argument right?" – Wrong. "You are passing the function as an argument to setState."
– Quentin
Nov 13 at 23:47
"setState is going to get called with an Object-Literal as the argument right?" – Wrong. "You are passing the function as an argument to setState."
– Quentin
Nov 13 at 23:47
AH! Now I see. That was the point. Since I came from Java, passing a whole function instead of its return value to another function is still unexpected. Thanks for that! :)
– Marc M
Nov 13 at 23:49
AH! Now I see. That was the point. Since I came from Java, passing a whole function instead of its return value to another function is still unexpected. Thanks for that! :)
– Marc M
Nov 13 at 23:49
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53290754%2fwhat-does-this-setstate-call-do-in-reactjs%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
reactjs.org/docs/react-component.html#setstate
– Alexander Staroselsky
Nov 13 at 23:02
1
It might make more sense if you write
this.setState(function (previousState) { return { isToggleOn: !previousState.isToggleOn }; }). You can name the argument of the function whatever you see fit.– Tholle
Nov 13 at 23:03
Yeah, that's a good complement. But I'm wondering where the value for previousState is going to come from. See my comment under @Quentin's answer
– Marc M
Nov 13 at 23:46