javascript - 可选择将参数传递给被传递的函数

Question

我有以下功能:

export function dateFormatter(date: string) {
  return moment(date).format("MM/DD/YYYY");
}

我有一个 React 组件，我可以在其中传递这样的函数:

<TableColumn field="endDate" format={dateFormatter}>End Date</TableColumn>

那个组件调用函数是这样的:

const { format, field } = column.props;
if (format) {
  return format(cell);
}
return cell;

一切正常。我现在想更改我的 dateFormatter 函数，以便我可以有选择地将一个参数传递给它。我不清楚如何执行此操作，因为如果我将引用更改为:

<TableColumn field="endDate" format={dateFormatter("MM/YY")}>End Date</TableColumn>

它将将该格式作为日期传递到我的函数中。

我怎样才能有选择地将参数传递到我将传递的函数中？

Answer 1

不是导出执行格式化的函数，而是导出使成为函数的函数:

export function makeFormatter(format: string) {
  return function(date: string) {
    return moment(date).format(format || "MM/DD/YYYY");
  };
}

当您使用该函数时，您将调用插入到 makeFormatter() 所需的格式(或什么都不做以获得默认值)。为了方便起见，您当然可以预先制作几个不同的格式化函数:

var formatters = {
  mmddyyyy: makeFormatter("MM/DD/YYYY"),
  euro: makeFormatter("DD/MM/YYYY"),
  datetime: makeFormatter("MM/DD/YYYY hh:mm"),
  // etc
};

然后您可以在代码中使用 formatters.mmddyyyy 来获取该格式化程序。