В чем разница между "(.....);" и "{......}" в реакции?
Я получаю сообщение об ошибке, показанное на изображении для приведенного ниже кода:
handlechange(event) {
this.setState (prevState => {
return(
checked : !prevState.checked
);});
}
Но когда я меняю круглые скобки после «возврата» на фигурные, все работает нормально. Я имею в виду, что происходит под капотом? Что заставляет ошибку исчезнуть?
handlechange(event) {
this.setState (prevState => {
return{
checked : !prevState.checked
}});
}
Ну, один - это вызов функции, а другой - литерал объекта
@CodeManiac - () после return не формируют вызов функции.
@ T.J. Краудер о да. спасибо за указание.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Это не React. Ваш первый пример - это просто недопустимый синтаксис JavaScript. Ваш второй пример - это допустимый синтаксис, возвращающий объект, созданный с помощью инициализатора объекта (часто называемого «литералом» объекта, {checked: !prevState.checked}).
¹ () после return оборачивает выражение, а затем внутри выражения у вас есть checked: !prevState.checked, который выглядит как помеченный оператор. Но вы не можете поместить помеченный оператор там, где ожидается выражение.
Боковое примечание: еще один способ записи - использовать деструктуризацию свойств в списке параметров и сокращенное свойство в инициализаторе объекта:
handlechange(event) {
this.setState(({checked}) => {
checked = !checked;
return {checked};
});
}
каково значение ({..}) во второй строке вашего кода. Фигурные скобки обозначают объект JS, но как насчет круглых скобок?
В стрелочной функции, если список параметров является чем-то более сложным, чем простой список параметров, содержащий только одно имя параметра, вы должны поместить этот список в (). Так, например, a => { /* ... */} - это правильная стрелочная функция, а a, b => { /* ... */ } - нет, потому что ему нужен () вокруг списка параметров: (a, b) => { /* ... */ }. Во второй строке кода выше, поскольку я использую деструктуризацию в списке параметров ({checked}), это больше не простой список параметров, поэтому список должен быть в ().
Общая картина: эта деструктуризация извлекает значение свойства checked из аргумента, переданного в функцию обратного вызова setState, и помещает его в параметр с именем checked. Таким образом, this.setState(({checked}) => { /* ... */ }) фактически такой же, как this.setState(prevState => { let checked = prevState.checked; /* ... */ }).
В случае, если это работает правильно, вы возвращаете объект JavaScript (определяемый фигурными скобками). Похоже, что это именно то, что вы хотите сделать, учитывая используемую вами нотацию значения свойства-двоеточия, но фигурные скобки необходимы для обозначения объекта в JavaScript.
{
key: value
}
это юридическое определение объекта, но
(
key: value
)
не является.
Изображение не отображается, поэтому я просто вставляю ошибку в комментарии. «Ошибка синтаксического анализа: неожиданный токен» на восклицательном знаке в «проверено:! PrevState.checked»