在雄辩的JavaScript第五章中总结“约简”

Question

我目前正在阅读Marijn的“雄辩的Javascript”，但是在理解高阶函数时遇到了困难。

在第5章的“总结和减少”中，他编写了以下代码：

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.reduce使用最大的characterCount返回对象。

function characterCount返回script.ranges.reduce，它返回SCRIPTS.reduce发送的对象范围的差值之和。

作为currentValue，它从ranges“创建”一个Array，并给出名称：from和to，并将它们的差异添加到初始化为零(0)的count中。

我希望这是有帮助的，我没有错过任何东西。

请参阅我在问题的编辑中添加的片段。

转变：

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;

是条件(三元)算子