redux中的常量有什么意义？

Question

例如,从这个例子:

export const ADD_TODO = 'ADD_TODO'
export const DELETE_TODO = 'DELETE_TODO'
export const EDIT_TODO = 'EDIT_TODO'
export const COMPLETE_TODO = 'COMPLETE_TODO'
export const COMPLETE_ALL = 'COMPLETE_ALL'
export const CLEAR_COMPLETED = 'CLEAR_COMPLETED'

这不像你在拯救角色.变量名称与字符串完全相同,永远不会更改.如果有一天你做了以下事情,我理解制作常量:

ADD_TODO = 'CREATE_TODO'

但这从未发生过.那么这些常数的用途是什么？

Answer 1

你是对的,它不是关于保存字符,但是在代码缩小后你可以节省一些空间.

在redux中,你至少在两个地方使用这些常量 - 在你的reducer和动作创建过程中.因此,在某些文件中定义一次常量非常方便,例如actionTypes.js

export const ADD_TODO = 'ADD_TODO';
export const DELETE_TODO = 'DELETE_TODO';
export const EDIT_TODO = 'EDIT_TODO';
export const COMPLETE_TODO = 'COMPLETE_TODO';
export const COMPLETE_ALL = 'COMPLETE_ALL';
export const CLEAR_COMPLETED = 'CLEAR_COMPLETED';

然后在动作创建者文件中要求它,例如 actions.js

import { ADD_TODO } from './actionTypes';

export function addTodo(text) {
  return { type: ADD_TODO, text };
}

并在一些减速机

import { ADD_TODO } from './actionTypes';

export default (state = [], action) => {
  switch (action.type) {
    case ADD_TODO:
      return [
        ...state,
        {
          text: action.text,
          completed: false
        }
      ];
    default:
      return state
  }
};

它允许您在项目中轻松找到该常量的所有用法(如果您使用IDE).它还可以防止你引入由错别字引起的愚蠢错误 - 在这种情况下,你会ReferenceError立即得到一个错误.

Answer 2

我想引用Reddin的作者@dan_abramov对类似Github问题的评论.

为什么这有益？通常声称常量是不必要的,对于小项目,这可能是正确的.对于大型项目,将操作类型定义为常量有一些好处:

• 它有助于保持命名的一致性,因为所有操作类型都集中在一个地方.

• 有时您希望在处理新功能之前查看所有现有操作.可能是你需要的行动已经被团队中的某个人添加了,但你不知道.

• 在Pull Request中添加,删除和更改的操作类型列表可帮助团队中的每个人跟踪新功能的范围和实现.

• 如果在导入动作常量时输入拼写错误,则会得到未定义的.当你想知道为什么在调度动作时没有任何反应时,这比输入错误要容易得多.

这是Github问题的链接

Answer 3

这在其他语言中更有用，但在 JavaScript 中也有点用。例如，如果我"ADD_TODO"在整个代码中使用 , 而不是ADD_TODO，那么如果我在输入任何字符串时出错，如果它是类似的代码if (action === 'ADD_TODOz')，当该代码执行时，它会做错事。但是，如果您错误地输入了 const, 的名称if (action === ADD_TODOz)，那么ReferenceError: ADD_TODOz is not defined当该行尝试执行时，您会得到一些 a - 因为ADD_TODOz是无效引用。而且，当然，在静态语言中，您会在“编译时”收到错误消息。