javascript - Redux - 使用 getState 是否不优雅或效率低下？

Question

假设我在全局商店中有很多实体

• 苹果
• 商店
• 果汁

如果我想要函数 getAppleJuicePrice，我可以通过 2-3 种方式实现

1. 通过参数

   function getAppleJuicePrice(apples, juices) {
       return apples * juices; // Some computing
   }
   

2. 通过 getState，无参数

   function getAppleJuicePrice() {
       return (dispatch, getState) => {
           const {apples, juices} = getState();
   
           return apples * juices; // Some computing
       }
   }
   

3. 通过 getState 和参数

   function getAppleJuicePrice(applesParam, juicesParam){
       return (dispatch, getState) => {
           const apples = applesParam || getState().apples;
           const juices = juicesParam || getState().juices;
   
           return apples * juices; // Some computing
       }
   }
   

*在情况 2,3 中我需要分派(dispatch)该函数

您能给我一些建议吗

A) 函数 1,2,3 - 这样可以吗？或者其中一些更好？

B)架构(我的意思是我们在全局存储中有很多实体，因此我们甚至可以创建依赖于它们的函数)

Answer 1

我强烈主张例如#1。

这个函数是纯粹的、描述性的，不依赖外部知识。假设您已经可以访问状态，那么导出您想要的值几乎总是比直接请求状态更好。

如果不可能，则将数据检索分解到第二个函数，然后将您的值传递到第一个函数。这样您就可以清楚地分离关注点，您的方法很容易理解，您不依赖副作用(状态值的存在)，并且两种方法都应该易于测试。

天啊，你可以更进一步，将函数 1 重构为一个通用实用程序，用于比较/组合任何东西的价格，而不仅仅是苹果和果汁。

const stateObject = getState() // At top of whatever scope

// Generic, no side-effects
function processPrice (x, y) {
  return x * y; // Whatever processing
}

// Specific, injected dependency on state
function getAppleJuicePrice (state) {
  const { apples, juice } = state;
  return processPrice(apples, juice);
}

// Explicit value assignment
const appleJuicePrice = getAppleJuicePrice(stateObject)

对商店架构的快速评论:始终致力于使其尽可能简单、扁平且与数据相关。避免仅仅为了方便值(value)计算而损害商店的数据结构。任何您可以在本地(并且轻松)获得的内容都应该这样做。商店不是进行复杂值突变的地方。

(*先发制人这不是一个硬性规则，只是一个指导方针)