Так много скобок. Я действительно не могу обернуть голову вокруг всех этих скобок

Question

Почему здесь два набора скобок?

return state.filter(({ id }) => {
            return id !== action.id    
    });

У меня такое трудное время, чтобы обернуть голову вокруг этого одного утверждения! Почему это не может быть просто:

return state.filter({ id }) => {
            return id !== action.id
        };

Любой, кто может даже попытаться помочь мне, был бы потрясающим!

Answer 1

Во втором примере вы пишете {id} в качестве аргумента filter, но filter принимает в качестве аргумента функцию обратного вызова, написанную таким образом

(arg) => {/*my code*/;}

, поэтому возьмите этот кусок кодаи поместите в качестве аргумента этот результат

myFunction((arg) => {/*my code;*/})

вы также можете сделать

myCallback = (arg) => {/*my code*/;}
myFunction(myCallback);

также я предполагаю, что вы получите синтаксическую ошибку, так как основная часть вашей функции просто написана безАргументы.

Вот ваш первый пример с небольшим интервалом между скобками для лучшего понимания логики:

state.filter(  ({ id }) => {return id !== action.id} );

Еще один способ записи, который будет

state.filter(  function({ id }){return id !== action.id}  );

Это понятнее?

Answer 2

Если вы используете, как во втором примере, синтаксис будет неправильным. Вы закрываете скобки сразу после оператора filter.

В первом примере код выглядит примерно так:

return state.filter( (someObj) => {
            return someObj.id !== action.id    
});

Но чтобы сократить это, мы деструктурируем параметр id. Как это:

const { id } = someObj;

Подробнее об уничтожении см. Здесь .

В аргументах функции мы делаем это следующим образом:

( { id } ) => { ... }

Здесь мы непосредственно выбираем свойство id из объекта аргумента.

И над этим есть скобка filter. Итак:

filter( ( { id } ) => { ... } )