javascript - array.filter 参数仅在包裹在 {} 周围时才有效

Question

我是 JavaScript 和 Redux 新手。我正在尝试根据 Redux 中的一个 reducer 中的 id 过滤数组，如果我只将 id 传递给回调函数，它就不起作用，但如果 id 包裹在 {id} 周围，它就起作用。

//Default store
const defaultState = {
  articles: [],
  filtercriteria: {}
};

//Reducer
const articlesReducer = (state = defaultState.articles, action) => {
  switch (action.type) {
    case "ADD":
      return [...state, action.article];
    case "REMOVE":
      //return state.filter(id => id !== action.id); //**DOES NOT WORK**
      return state.filter(({id}) => id !== action.id); // **WORKS**
    default:
      return state;
  }
  return state;
};

//Action Creator and Action
const remove = id => {
  return {
    type: "REMOVE",
    id
  };
};

//Action Dispatch
const addActionObject = store.dispatch(add());
store.dispatch(remove(addActionObject.article.id));

Answer 1

因为你正在使用 destructuring

The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.

如果您不使用解构，您将使用如下所示的函数:

state.filter((item) => item.id !== action.id);

但是您可以使用解构将现有属性“id”分配给不同的变量

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