【发布时间】：2021-04-21 17:51:02
【问题描述】：
我在一个教程中看到了这段代码 sn-p：
const myFunction = () => {
return function (caller) {
caller(firstFuctnion());
caller(secondFunction());
};
};
你能告诉我一旦我这样称呼它是如何工作的：
myFunction()
caller 参数实际上没有定义，我怎么没有报错？
另一方面，如果我省略它并编写如下代码：
const myFunction = () => {
return function () {
firstFuctnion();
secondFunction();
};
};
firstFuction() 和 secondFunction() 这两个函数没有被执行。那么，caller — 或者不管它叫什么 — 究竟是如何工作的？
对于那些可能想查看整个功能代码的人：
const redux = require("redux");
const thunkMiddleware = require("redux-thunk").default;
const axios = require("axios");
const createStore = redux.createStore;
const applyMiddleware = redux.applyMiddleware;
const initialState = {
loading: false,
users: [],
error: "",
};
const FETCH_USERS_REQUEST = "FETCH_USERS_REQUEST";
const FETCH_USERS_SUCCESS = "FETCH_USERS_SUCCESS";
const FETCH_USERS_FAILURE = "FETCH_USERS_FAILURE";
const fetchUsersRequest = () => {
return {
type: FETCH_USERS_REQUEST,
};
};
const fetchUsersSuccess = (users) => {
return {
type: FETCH_USERS_SUCCESS,
payload: users,
};
};
const fetchUsersFailure = (error) => {
return {
type: FETCH_USERS_FAILURE,
payload: error,
};
};
const fetchUsers = () => {
return function (dispatch) {
dispatch(fetchUsersRequest());
axios
.get("https://jsonplaceholder.typicode.com/users")
.then((response) => {
// response.data is the users
const users = response.data.map((user) => user.id);
dispatch(fetchUsersSuccess(users));
})
.catch((error) => {
// error.message is the error message
dispatch(fetchUsersFailure(error.message));
});
};
};
const reducer = (state = initialState, action) => {
console.log(action.type);
switch (action.type) {
case FETCH_USERS_REQUEST:
return {
...state,
loading: true,
};
case FETCH_USERS_SUCCESS:
return {
loading: false,
users: action.payload,
error: "",
};
case FETCH_USERS_FAILURE:
return {
loading: false,
users: [],
error: action.payload,
};
}
};
const store = createStore(reducer, applyMiddleware(thunkMiddleware));
store.subscribe(() => {
console.log(store.getState());
});
store.dispatch(fetchUsers());我不明白这部分。 dispatch 实际上做了什么。它没有作为参数传递，也没有在任何地方定义它是什么。是功能吗？我可以在那里写whatever。
const fetchUsers = () => {
return function (dispatch) {
dispatch(fetchUsersRequest());
axios
.get("https://jsonplaceholder.typicode.com/users")
.then((response) => {
// response.data is the users
const users = response.data.map((user) => user.id);
dispatch(fetchUsersSuccess(users));
})
.catch((error) => {
// error.message is the error message
dispatch(fetchUsersFailure(error.message));
});
}; };
【问题讨论】：
-
相关：Functions that return a function。 “
caller参数实际上没有定义”是什么意思？可以这么说，那个论点还没有进入等式。myFunction()是一个函数，您需要为其提供caller参数，例如myFunction()(alert)。或者换一种说法，“我怎么没有收到错误” — 与function sum(a, b){ return a + b; }; sum;没有抛出错误的原因相同，尽管没有提供a和b；需要这些参数的函数还没有被调用。 -
需要使用
myFunction()()才能到达内部函数 -
你已经得到了一些很好的答案，所以我不打算写论文了。在 redux-thunk 的情况下，thunk 中间件允许您
dispatch一个动作，它是dispatch的函数，而不仅仅是一个普通的动作对象。内部函数在函数被分派到 store 时由 thunk 中间件调用。 -
谢谢@LindaPaiste，这也是我缺少的部分。由于 redux-thunk，
dispatch接受函数。 -
你没有调用你的函数，仅此而已。
标签： javascript redux higher-order-functions