redux中的常量有什么意义?
例如从这个例子:
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'
这不像你保存的字符。 variables名与string完全一样,永远不会改变。 我知道如果有一天你做了这样的事情,你可以做些常量:
ADD_TODO = 'CREATE_TODO'
但那从来没有发生过。 那么这些常数的目的是什么?
你是对的,但是在代码缩小之后不是保存字符,而是可以节省一些空间。
在redux中,至less在两个地方使用这些常量 – 在你的reducer和动作创build过程中。 所以在一些文件中定义一个常量比如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';
然后在动作创build者文件中需要它,例如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 } };
它使您可以轻松find整个项目中常量的所有用法(如果使用IDE)。 它也可以防止你引入错误导致的愚蠢的错误 – 在这种情况下,你将立即得到一个ReferenceError
。
我想引用@dan_abramov ,从类似的Github问题的评论Redux的作者。
为什么这是有益的? 人们经常声称,常量是不必要的,对于小型项目来说,这可能是正确的。 对于较大的项目,将动作types定义为常量有一些好处:
它有助于保持命名的一致性,因为所有的动作types都集中在一个地方。
有时,您希望在使用新function之前查看所有现有的操作。 这可能是你需要的行动已经被团队中的某个人添加了,但是你不知道。
在“合并请求”中添加,删除和更改的操作types列表可帮助团队中的每个人跟踪新function的范围和实施情况。
如果在导入操作常量时出现拼写错误,您将得到未定义的值。 当你想知道为什么在动作发出时没有任何反应,这比错字更容易被注意到。
这是Github问题的链接
这在其他语言中更有用,但在JavaScript中也有一些用处。 例如,如果我在整个代码中使用了"ADD_TODO"
而不是ADD_TODO
,那么如果我input任何string时出现错误,如果它是像if (action === 'ADD_TODOz')
这样的代码,那么代码执行,它会做错事。 但是,如果错误地input了const的名字, if (action === ADD_TODOz)
,会得到som类的ReferenceError: ADD_TODOz is not defined
当该行尝试执行时, ReferenceError: ADD_TODOz is not defined
,因为ADD_TODOz
是无效的引用。 当然,在静态语言中,你会在“编译时”得到一个错误。
与redux无关,但对于所有反应的开发者来说,这是一个有用的提示
考虑这个例子:
render() { return ( veryBigArray.map((item) => { return ( <li key={ index }> { item.value || "Missing Value" } </li> ); }); ); }
问题:为什么我应该将“缺失值”提取为一个常量?
回答: Javascript基本上是调用new String('Missing value')
因此为数组中的每个项目和每个render()
执行创build一个新的对象。 这是不必要的,取决于arrays的大小会影响性能