有没有更简洁的方法来编写这个更改数组中项目的化简器函数



我注意到我的许多化简器都遵循一种通用模式,它们通过唯一 id 在数组中查找项目并更改其属性。现在我使用的模式如下所示:

case ActionTypes.CHANGE_DOCUMENT: {
  const documents = cloneArray(state.documents);
  const documentIndex = documents.findIndex(o => o.id === action.id);
  const document = documents.find(o => o.id === action.id);
  documents[documentIndex] = {
    ...document,
    ...action.documentExtension
  }
  return {
    ...state,
    documents
  }      
}

这是对数组中的唯一元素进行更改的良好模式吗?对我来说,它看起来不错,但我想知道其他人是否为这种情况找到了更优雅/简洁的解决方案。

是的,您只需在文档上执行一个映射来清理代码,在对文档数组进行一次传递时更新要更新的映射。这将时间复杂度降低了一半

const documents = state.documents.map( (document, index) => {
    if (document.id === action.id) {
        return {
            ...document,
            ...action.documentExtension
        }
    } else {
        return document
    }
});

或更内联一点

const documents = state.documents.map( (document, index) => document.id === action.id ? {...document, ...action.documentExtension} : document);

取@JohnRuddell的答案并进一步迭代:

case ActionTypes.CHANGE_DOCUMENT: {
  const documents = state.documents.map((document) => ({
    ...document,
    ...(document.id === action.id ? action.documentExtension : {}),
  }));
  return {
    ...state,
    documents,
  };
}

根据@markerikson的反馈和Redux文档的链接更新了答案。

case ActionTypes.CHANGE_DOCUMENT: {
  const documents = state.documents.map((document) => {
    return (document.id !== action.id) ? document : {
        ...document,
        ...action.documentExtension,
    };
  });
  return {
    ...state,
    documents,
  };
}

最新更新