javascript - 流类型不适用于匿名函数内的外部作用域变量

Question

我为分派(dispatch)给 reducer 的操作定义了一个类型:

type RemoveQuestionAction = {
  type: 'REMOVE_QUESTION',
  questionId: number,
  docTypeId: number,
};

type QuestionAction =
  | RemoveQuestionAction
  | ...

reducer 检查每个操作的类型:

const questions = (
  state : QuestionState = defaultState,
  action : QuestionAction
) : QuestionState => {...};

字段questionId在几个数组过滤器中被引用:

  case REMOVE_QUESTION: {

    return {
      ...state,
      byId: state.allIds
                             // Throws error
        .filter(id => id !== action.questionId)
        .reduce((col, id) => ({
          ...col,
          [id]: state.byId[String(id)],
        }), {}),
                                               // Throws error
      allIds: state.allIds.filter(id => id !== action.questionId),
    };    
  }

这会引发 action.questionId 的类型错误。

但是，如果将操作的值放入变量中，那就很高兴了:

  case REMOVE_QUESTION: {
    let { questionId } = action; // Ok with this

    return {
      ...state,
      byId: state.allIds
        .filter(id => id !== questionId)
        .reduce((col, id) => ({
          ...col,
          [id]: state.byId[String(id)],
        }), {}),
      allIds: state.allIds.filter(id => id !== questionId),
    };    
  }

为什么我不能直接使用action的值？

这是一个REPL .

它在 REPL 中的表现符合预期，真的很奇怪，因为我看不出有什么不同..

Flow 版本为 6.23

Answer 1

action.questionId由于 the doc for type refinement 中解释的细化无效而引发错误。不确定流量是否action仍然是RemoveQuestionAction或当箭头功能赋予 filter() 时，否由 case REMOVE_QUESTION: 细化后执行.

我们人类知道filter() 立即执行给定的回调函数，如 id => id !== action.questionId这样action根本无法修改。然而，从流程的 Angular 来看，filter()只是一个以回调函数作为参数的函数，回调函数可以稍后执行，就像addEventListener()一样做。如果稍后可以执行回调函数，则有可能 action被修改并且类型细化不再成立。这就是为什么 flow 使 action 的类型细化无效的原因。在这种情况下。