Is there a shorter way applying reduce method?

[sh11]

Hi,
given an array of words. With reduce I want to add the lengths of all words.

function calculateLength(items) {
  let totalLength = 0;
  let itemLength = [];
  items.map(e => itemLength.push(e.length));
  totalLength = itemLength.reduce(e => e + e);
  return totalLength;
}
calculateLength(["dog", "donkey", "cat"]); //12

Is there a way to get rid of the map method to use just reduce? If I do so without pushing the lengths of items into a new array (itemLength), I got NaN.

[rpkamp]

This works:

["dog", "donkey", "cat"].reduce((runningTotal, current) => runningTotal + current.length, 0);

[Paul_Wilkins]

Is reduce even needed? Here is an even shorter way is with no reduce at all

["dog", "donkey", "cat"].join("").length; //12

[Paul_Wilkins]

If reduce is required as a part of a syllabus to help you learn about using reduce, I recommend using a separate named function for the reduce method.

function countLength(accumulator, item) {
    return accumulator + item.length;
}
const animals = ["dog", "donkey", "cat"];
const totalLength = animals.reduce(countLength, 0); // 12

And only when the function code is simple enough to represent as a one-liner, to use arrow notation instead.

const animals = ["dog", "donkey", "cat"];
const countLength = (accumulator, item) => accumulator + item.length;
const totalLength = animals.reduce(countLength, 0); // 12

Or even, with a common-practice of acc for the accumulator.

const animals = ["dog", "donkey", "cat"];
const countLength = (acc, item) => acc + item.length;
const totalLength = animals.reduce(countLength, 0); // 12

Sometimes you can remove the comma zero from the reduce too, but that’s only when the first item can be automatically used as the initial value, which isn’t the case here.

[Paul_Wilkins]

What kind of changes would be needed so that the comma zero can be removed?
It would be to map to lengths first and then reduce.

const animals = ["dog", "donkey", "cat"];
const getLength = (item) => item.length;
const add = (acc, count) => acc + count;
const totalLength = animals.map(getLength).reduce(add); // 12

Is that better than the last code from the previous post?

const animals = ["dog", "donkey", "cat"];
const countLength = (acc, item) => acc + item.length;
const totalLength = animals.reduce(countLength, 0); // 12

I think that I prefer that instead, but the decision can be different depending on the code. What’s important is to explore some of the different ways to do things, for that’s when you can compare and contrast.

[sh11]

Hi @Paul_Wilkins many thanks for the clarification. Especially the part with “comma 0” I found interesting. I will get accustomed to, to always user “comma 0” at the end (inital value) to reduce (no pun intended) error messages with empty-arrays.

[Paul_Wilkins]

@sh11

I will get accustomed to, to always user “comma 0” at the end (inital value) to reduce (no pun intended) error messages with empty-arrays.

Comma zero shouldn’t always be used. That’s only used in this example as 0 is that starting value for the count that we’re doing.

Sometimes comma array is used instead for example, when you want to start with an empty array, and other times it’s something else different yet again, depending on what your initial state should be.