Написание кратких, удобочитаемых стрелочных функций

Я использую Codewars и подобные для разминки. Когда я пытался писать решения максимально лаконично, мой коллега заметил, что моя функция (которая находит элемент массива, дающий наибольший результат при передаче в обратном вызове) определенно короткая, но неинтуитивная.

const maxBy = (arr, callback) => arr.reduce((max, el) => callback(el) > max.val ? {val: callback(el), el} : max, {val: -Infinity, el: undefined}).el;

Хотя краткость прекрасна, она не очень полезна, если это означает, что мой код не может быть легко разобран тем, кто смотрит на него в следующий раз. У Airbnb есть некоторые мнения по подобным случаям, но они немного менее подробные по сравнению с их руководством по функциям в целом. Тем не менее, их предложения могут иметь большое значение.

Во-первых, давайте добавим круглые скобки. Добавление скобок определенно помогает убрать запятую после max и перед вторым аргументом reduce.

const maxBy = (arr, callback) => (arr.reduce((max, el) => (callback(el) > max.val ? {val: callback(el), el} : max), {val: -Infinity, el: undefined}).el);

На самом деле здесь определены две функции: maxBy и анонимный обратный вызов для reduce. Давайте разобьем эти функции на отдельные строки.

const maxBy = (arr, callback) => (
  arr.reduce((max, el) => (
    callback(el) > max.val ? {val: callback(el), el} : max
  ), {val: -Infinity, el: undefined}).el
);

Намного лучше! Эта третья строка может приближаться к пределу того, что должно быть в одной строке. Мы можем немного отойти от Airbnb и разделить его на несколько строк.

const maxBy = (arr, callback) => (
  arr.reduce((max, el) => (
    callback(el) > max.val
      ? {val: callback(el), el}
      : max
  ), {val: -Infinity, el: undefined}).el
);

Не уверен насчет этого болтающегося .el в конце. Возможно, это не обязательно должно быть однострочное решение, но писать его именно так — забавно. Также всегда открыты для предложений.