В чем разница между "(.....);"и "{......}" реагирует?

Question

Я получаю сообщение об ошибке, показанное на рисунке ниже:

handlechange(event) {
    this.setState (prevState => {
      return(
      checked : !prevState.checked
    );});
}

Но когда я заменяю круглые скобки после «возврата» на фигурные, все работает нормально.Я имею в виду, что происходит под капотом?Что приводит к исчезновению ошибки?

handlechange(event) {
    this.setState (prevState => {
      return{
      checked : !prevState.checked
    }});
}

Answer 1

В случае, если работает правильно, вы возвращаете объект JavaScript (определенный в фигурных скобках).Похоже, это то, что вы хотите сделать, учитывая используемую нотацию свойство-двоеточие-значение, но фигурные скобки необходимы для обозначения объекта в JavaScript.

{
    key: value
}

- это допустимое определение объекта,но

(
    key: value
)

нет.

Answer 2

Это не React.Ваш первый пример - просто недопустимый синтаксис JavaScript. Второй пример - допустимый синтаксис, возвращающий объект, созданный через инициализатор объекта (часто называемый объектом "literal" {checked: !prevState.checked}).

---

¹() после return обернуть выражение, а затем внутри выражения у вас есть checked: !prevState.checked, которое выглядит как помеченное выражение.Но вы не можете поместить помеченный оператор там, где ожидается выражение.

---

Примечание: еще один способ написать это использовать деструктуризацию свойства в списке параметров и сокращенное свойство в инициализаторе объекта:

handlechange(event) {
    this.setState(({checked}) => {
      checked = !checked;
      return {checked};
    });
}