箭头函数不应返回赋值Eslint

Question

我正在映射从API返回的值，如果不存在值，则将虚拟值添加为防御代码。为此，我正在使用JS Map获得结果。但不幸的是，我收到错误代码Arrow function should not return assignment。在这里，我分享了我实现的代码。请检查并向我提出最佳解决方案。我不想禁用eslint错误。在此先感谢。

代码：

 const chartData = res.data.map(
    (data) => data.latestMetric = data.latestMetric === null ? dummyLatestMetric : data.latestMetric
  );

错误：

Arrow function should not return assignment. eslint (no-return-assign)

Answer 1

由于您没有从arrow函数显式返回值，所以eslint希望您将函数与主体一起使用。

这应该解决它：

 const chartData = res.data.map(
    (data) => {
      data.latestMetric = data.latestMetric === null ? dummyLatestMetric : data.latestMetric;
 });

Answer 2

您需要返回值，而不是尝试将其分配给这样的变量：

const chartData = res.data.map(
  (data) => {return data.latestMetric === null ? dummyLatestMetric : data.latestMetric}
);

Answer 3

问题：

https://eslint.org/docs/rules/no-return-assign

此规则告诉您不允许返回以下分配操作：

return a = 3 // or similar.

但是这正是您正在做的，所以

技巧是返回对象/属性，而不是分配操作=。

[不清楚您要返回.map的是什么有趣的东西，您要返回整个data还是仅返回data.latestMetric，所以我的回答还包括两种情况：

如果需要修改data并返回它，请尝试以下操作：

const chartData = res.data.map(
  data => (data.latestMetric = data.latestMetric === null ? dummyLatestMetric : data.latestMetric) && data
  // updated data.latestMetric and then returning a whole object
);

如果您仅需要data.latestMetric，请尝试以下操作：

const chartData = res.data.map(
  data => data.latestMetric === null ? dummyLatestMetric : data.latestMetric
);

Answer 4

Arrow Function

箭头函数表达式在语法上比常规函数表达式更紧凑，但是没有与this，arguments，super或new.target关键字的绑定。箭头函数表达式不适合用作方法，不能用作构造函数。

Map Function

map（）方法创建一个新数组，其中填充了在调用数组中每个元素上调用提供的函数的结果。

---

.map()函数将要求您为每次迭代返回一个值。如果只想遍历数组以产生副作用，则可以考虑forEach或其他循环函数。

在您的情况下，我看到您想有条件地修改latestMetric中的res.data，您可以这样做：

const chartData = res.data.map(data => ({
  ...data,
  latestMetric: data.latestMetric === null ? dummyLatestMetric : data.latestMetric,
});

spread syntax会将data属性传播到一个新对象中，然后我们根据条件有条件地设置latestMetric的值

如果您不想使用传播语法，也可以使用传统的Object.assign方法：

const chartData = res.data.map(data => Object.assign({}, data, {
  latestMetric: data.latestMetric === null ? dummyLatestMetric : data.latestMetric,
});