返回什么？

Question

我正在阅读下面的示例中使用 React、Redux 和 Thunk 编写的 JavaScript：

在actions.js中创建动作：

function fetchPosts(subreddit){
    return dispatch => {
            dispatch(requestPosts(subreddit))
            return fetch(`...URL...`)
                    .then(response => response.json())
                    .then(json => dispatch(receivePosts(subreddit, json)))
    }
}

export function fetchPostsIfNeeded(subreddit) {
  return (dispatch, getState) => {
    if (shouldFetchPosts(getState(), subreddit)) {
      return dispatch(fetchPosts(subreddit))
    }
  }

“fetchPosts(subreddit)”返回什么？。

我不明白“退货=>”是什么。

这个函数是在容器中导入并用于调度动作，所以我 认为“dispatch”是从容器中的“react-redux”导入的函数，如下所示：

import {fetchPostsIfNeeded} from "../actions"
import {connect} from "react-redux"
...
componentDidMount() {
    const { dispatch, selectedSubreddit } = this.props
    dispatch(fetchPostsIfNeeded(selectedSubreddit))
  }
...

箭头前的“dispatch”是指函数“dispatch(requestPosts(subreddit))”吗？

dispatch 是 ES2015 缩写为“(dispatch)”的参数吗？

Answer 1

来自https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions：

// Parentheses are optional when there's only one parameter:
(singleParam) => { statements }
singleParam => { statements }

因此，dispatch => {...} 正在制作一个带有一个参数 dispatch 的箭头函数。 fetchPosts(subreddit) 返回单个箭头函数。

关于{ disppatch, selectedSubreddit } = this.props 的废话叫做解构赋值。手册：MDN Destructuring Assignment

它的本质是：

var o = {p: 42, q: true};
var {p, q} = o;
console.log(p); // 42
console.log(q); // true

所以是的，dispatch 是从 this.props 中提取出来的，这显然是一个 reactjs 组件！ ReactJS Components and Props