Why extra parentheses?

JavaScript
#1

Tell us what’s happening:
Hello, I am trying to figure out why we need parentheses after the arrow in bellow code. Ideas, comments, solutions are very welcome :grinning:
Thanx!
P.S. It is my understanding that this kind of unclarities cause much coding problems later on, so I am trying to grasp it early. :sweat_smile:
Thanks in advance for your time and effort!

Your code so far

   this.setState(state => ({
     count: state.count + 1
   }));
// why not as bellow?

increment() {
   this.setState(state => {
     count: state.count + 1
   });     
```jsx

class Counter extends React.Component {
constructor(props) {
 super(props);
 this.state = {
   count: 0
 };
 // change code below this line

 // change code above this line
}
// change code below this line

// change code above this line
render() {
 return (
   <div>
     <button className='inc' onClick={this.increment}>Increment!</button>
     <button className='dec' onClick={this.decrement}>Decrement!</button>
     <button className='reset' onClick={this.reset}>Reset</button>
     <h1>Current Count: {this.state.count}</h1>
   </div>
 );
}
};

Your browser information:

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

Challenge: Write a Simple Counter

Link to the challenge:

#2

it’s a thing with arrow functions

if yoo write () => {} then the graph parenthesis are expected to be for the function body
if instead you want to return an object with implicit return you need to wrap the object in round parenthesis () => ({}) - in this way the graph parenthesis are not considered to be for the function body, but for an object

1 Like
#4