创建具有已知大小/性能的 Javascript 数组

Question

我已经重构了这段代码，但仍然觉得这可以写得更好（没有外部库）。有什么建议么？

  // Old

  const filters = [];

  for (let i = 1; i < 54; i += 1) {

    const currentDateDisplay = getStartDate(i, new Date().getFullYear());

    filters.push({ text: currentDateDisplay, value: currentDateDisplay });

  }

  // New

  const filters2 = [...Array(53).keys()].map((item) => ({

    text: getStartDate(item, new Date().getFullYear()),

    value: getStartDate(item, new Date().getFullYear()),

  }));

编辑：看起来有时最好使用旧的 for 循环，尤其是在性能方面。感谢您的建议。

Answer 1

我不得不同意您编写的第一个实现看起来更直观，但是，第二个方法可以用不同的方式编写。通过第一次调用new Array(53)，您创建了一个包含 53 个元素的数组。通过然后调用.map((_, index) => {})，您可以访问索引变量（使用_，item因为它是undefined无论如何）。您不必通过传播来克隆新数组，因此只需使用此代码即可：const filters = new Array(53).map((_, index) => ({&nbsp; text: getStartDate(index, new Date().getFullYear()),&nbsp; value: getStartDate(index, new Date().getFullYear())}));

Answer 2

你喜欢哪种风格最终是一个品味问题。如果你更喜欢第二种——更像函数式——的风格，你可以将其简化如下：const year = new Date().getFullYear();const filters2 = Array.from(new Array(53), (_, i) => {&nbsp; const startDate = getStartDate(i, year);&nbsp; return {text: startDate, value: startDate};});它替换[...Array(53).keys()].map()为更合适Array.from的值，并且不会多次评估相同的值。这种简单情况下的性能差异可以忽略不计，您应该使用对您和您的团队更易读的代码。

Answer 3

你想用一个初始值来初始化一个数组吗？这就是Array.fill()的用例const filters2 = new Array(53).fill({&nbsp; text: getStartDate(0, new Date().getFullYear()),&nbsp; value: getStartDate(0, new Date().getFullYear())});

Answer 4

我更喜欢您的old变体，因为它对我来说更具可读性。在我看来，代码应该更具可读性而不是更短。此外，根据测试，old 变体更快：const filters = [];for (let i = 1; i < 54; i += 1) {&nbsp; &nbsp; const currentDateDisplay = getStartDate(i, new Date().getFullYear());&nbsp; &nbsp; filters.push({ text: currentDateDisplay, value: currentDateDisplay });}