为什么要将Redux操作创建者返回的操作放在括号中？

Question

我试图理解Redux的todos示例（https://redux.js.org/introduction/examples#todos），其中包含以下内容actions/index.js：

let nextTodoId = 0
export const addTodo = text => ({
  type: 'ADD_TODO',
  id: nextTodoId++,
  text
})

export const setVisibilityFilter = filter => ({
  type: 'SET_VISIBILITY_FILTER',
  filter
})

export const toggleTodo = id => ({
  type: 'TOGGLE_TODO',
  id
})

export const VisibilityFilters = {
  SHOW_ALL: 'SHOW_ALL',
  SHOW_COMPLETED: 'SHOW_COMPLETED',
  SHOW_ACTIVE: 'SHOW_ACTIVE'
}

对我来说，还不是很清楚为什么由addTodo，setVisibilityFilter和返回的对象toggleTodo放在圆括号中，例如({...})，而不是花括号{...}吗？

我已经在http://jamesknelson.com/javascript-return-parenthesis/之类的地方阅读过，方括号对于防止Javascript过早插入分号很有用，但是开放式花括号是否也可以防止分号插入？

Answer 1

动作创建者是功能。功能主体括在花括号中。箭头函数使您可以立即返回，而不必使用return关键字，只需省略通常围绕函数主体的花括号即可。但是，对象也被花括号包围。如果省略括号，则箭头函数会认为它正在打开和关闭函数，而不是返回object。

它相信：

const myActionCreator = (value) => {
  type: 'MY_ACTION',
  value
};

手段：

const myActionCreator = function(value) {
  type: 'MY_ACTION',
  value
};

代替：

const myActionCreator = function(value) {
  return {
    type: 'MY_ACTION',
    value
  };
};

要解决此问题，请将括号括在花括号中。现在，箭头函数知道它返回的是括号内的内容，而不是打开函数主体。在括号内-您的对象。

所有箭头功能都适用，而不仅仅是redux。