Arrow function expected a return value

Question

How can I fix this warning? Is it wrong the way I'm using .map?

I'm trying to display total sales and total revenue in each month that is being received through another array that contains that info, to later on display it on a chart.

var arrEneSales = [0, 0, 0, 0, 0, 0];
var arrJulSales = [0, 0, 0, 0, 0, 0];

var arrMoneyEne = [0, 0, 0, 0, 0, 0];
var arrMoneyJul = [0, 0, 0, 0, 0, 0];

this.state.sales.map((item) => {
  var date = new Date(item[0].q1_date.seconds * 1000);
  if (date.getMonth() + 1 < 6) {
    arrEneSales[date.getMonth() + 1] += 1;
    arrMoneyEne[date.getMonth() + 1] += item[0].total;
  } else {
    arrJulSales[date.getMonth() + 1] += 1;
    arrMoneyJul[date.getMonth() + 1] += item[0].total;
  }
});

If you don't need the return value then you can use `.forEach` instead of `.map`. — Ross Allen, Aug 20 '20 at 16:37

score 1 · Accepted Answer · edited Jan 28 '23 at 23:13

The map method is used for returning an array. If you don’t want to return anything and just iterate through the array, then don’t use map; use forEach like this:

this.state.sales.forEach((item) => {
  var date = new Date(item[0].q1_date.seconds * 1000);
  
  if (date.getMonth() + 1 < 6) {
    arrEneSales[date.getMonth() + 1] += 1;
    arrMoneyEne[date.getMonth() + 1] += item[0].total;
  }
  else {
    arrJulSales[date.getMonth() + 1] += 1;
    arrMoneyJul[date.getMonth() + 1] += item[0].total;
  }
});

map works like this:

var returnedArray = this.state.sales.map((item) => {
  var date = new Date(item[0].q1_date.seconds * 1000);
  
  if (date.getMonth() + 1 < 6) {
    arrEneSales[date.getMonth() + 1] += 1;
    arrMoneyEne[date.getMonth() + 1] += item[0].total;
  }
  else {
    arrJulSales[date.getMonth() + 1] += 1;
    arrMoneyJul[date.getMonth() + 1] += item[0].total;
  }

  return item;
});

Amir-Mousavi · Answer 2 · 2020-08-20T16:59:08.563

From the type defenitions

/**
 * Performs the specified action for each element in an array.
 * @param callbackfn  A function that accepts up to three arguments. forEach calls the callbackfn function one time for each element in the array.
 * @param thisArg  An object to which the this keyword can refer in the callbackfn function. If thisArg is omitted, undefined is used as the this value.
 */
forEach(callbackfn: (value: T, index: number, array: T[]) => void, thisArg?: any): void;

/**
 * Calls a defined callback function on each element of an array, and returns an array that contains the results.
 * @param callbackfn A function that accepts up to three arguments. The map method calls the callbackfn function one time for each element in the array.
 * @param thisArg An object to which the this keyword can refer in the callbackfn function. If thisArg is omitted, undefined is used as the this value.
 */
map<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[];

So you see that the map function should return an array. You should use forEach that returns nothing/void

visit MDN for the javascript documentation on map function

Arrow function expected a return value

2 Answers2