总结 "reduce" Eloquent JavaScript 第 5 章

Question

我目前正在阅读 Marijn Haverbeke 的“Eloquent Javascript”，但无法理解高阶函数。

在第五章“用reduce总结”中，他写了如下代码：

function characterCount(script) {
  return script.ranges.reduce((count, [from, to]) => {
    return count + (to - from);
  }, 0);
}

console.log(SCRIPTS.reduce((a, b) => {
  return characterCount(a) < characterCount(b) ? b : a;
}));

SCRIPTS 样本：

var SCRIPTS = [
  {
    name: "Adlam",
    ranges: [[125184, 125259], [125264, 125274], [125278, 125280]],
    direction: "rtl",
    year: 1987,
    living: true,
    link: "https://en.wikipedia.org/wiki/Fula_alphabets#Adlam_alphabet"
  },
  {
    name: "Caucasian Albanian",
    ranges: [[66864, 66916], [66927, 66928]],
    direction: "ltr",
    year: 420,
    living: false,
    link: "https://en.wikipedia.org/wiki/Caucasian_Albanian_alphabet"
  },
  {
    name: "Ahom",
    ranges: [[71424, 71450], [71453, 71468], [71472, 71488]],
    direction: "ltr",
    year: 1250,
    living: false,
    link: "https://en.wikipedia.org/wiki/Ahom_alphabet"
  }
]

我很难理解这个问题。如果这不是太麻烦的话，任何人都可以通过逐行解释这一点来提供帮助吗？非常感谢所有帮助！

谢谢！

var SCRIPTS = [
  {
    name: "Adlam",
    ranges: [[125184, 125259], [125264, 125274], [125278, 125280]],
    direction: "rtl",
    year: 1987,
    living: true,
    link: "https://en.wikipedia.org/wiki/Fula_alphabets#Adlam_alphabet"
  },
  {
    name: "Caucasian Albanian",
    ranges: [[66864, 66916], [66927, 66928]],
    direction: "ltr",
    year: 420,
    living: false,
    link: "https://en.wikipedia.org/wiki/Caucasian_Albanian_alphabet"
  },
  {
    name: "Ahom",
    ranges: [[71424, 71450], [71453, 71468], [71472, 71488]],
    direction: "ltr",
    year: 1250,
    living: false,
    link: "https://en.wikipedia.org/wiki/Ahom_alphabet"
  }
]

function characterCount(script) {
  return script.ranges.reduce((count, [from, to]) => {
    return count + (to - from);
  }, 0);
}

console.log(SCRIPTS.reduce((a, b) => {
  return characterCount(a) < characterCount(b) ? b : a;
}));

Answer 1

reduce 像这样在 Array 上工作：
arr.reduce(callback( accumulator, currentValue, [, index[, array]] )[, initialValue]).

SCRIPTS.reducereturn最大的对象characterCount.

function characterCount returns script.ranges.reduce, returns SCRIPTS.reduce.
发送的对象范围差之和作为 currentValue，它从 ranges“创建”一个 Array 并给出名称：from 和 to，并将它们的差异添加到 count初始化为零 (0).

我希望这对您有所帮助并且我没有遗漏任何内容。
请参阅我在问题编辑中添加的片段。

转换：

function characterCount(script) {
  return script.ranges.reduce((count, [from, to]) => {
    return count + (to - from);
  }, 0);
}

console.log(SCRIPTS.reduce((a, b) => {
  return characterCount(a) < characterCount(b) ? b : a;
}));

使用 Array.reduce 定义中的名称，并分散在更多行中以提高可读性：

function characterCount(script) {
  return
    script.ranges.reduce(
      (accumulator, currentValue) => {
        return
          accumulator + (currentValue[1] - currentValue[0]);
      }, 0
    );
}

console.log(
  SCRIPTS.reduce(
    (accumulator, currentValue) => {
      return
        characterCount(accumulator) < characterCount(currentValue)
          ? currentValue
          : accumulator;
    }
  )
);

此外，characterCount(a) < characterCount(b) ? b : a 等于：

if(characterCount(a) < characterCount(b)) b;
else                                      a;

并且是 Conditional (ternary) operator

总结 "reduce" Eloquent JavaScript 第 5 章

Summarizing "reduce" in Eloquent JavaScript Chapter 5

javascript

reduce