Создать 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()),
  }));

Редактировать: Похоже, иногда лучше использовать старое для l oop, особенно когда речь идет о производительности. Спасибо за предложения.

Answer 1

Какой стиль вы предпочитаете, зависит от вкуса. Если вы предпочитаете второй, более функциональный стиль, вы можете упростить его, как показано ниже:

const year = new Date().getFullYear();
const filters2 = Array.from(new Array(53), (_, i) => {
  const startDate = getStartDate(i, year);
  return {text: startDate, value: startDate};
});

Он заменяет [...Array(53).keys()].map() на более подходящий Array.from и не оценивает одни и те же значения несколько раз. Различия в производительности в таком простом случае незначительны, и вы должны использовать код, который будет более читабельным для вас и вашей команды.

Answer 2

Вы хотите инициировать массив с начальными значениями? Вот вариант использования для Array.fill ()

const filters2 = new Array(53).fill({
  text: getStartDate(0, new Date().getFullYear()),
  value: getStartDate(0, new Date().getFullYear())
});

Answer 3

Я предпочитаю ваш вариант old, так как он более читабелен для меня. На мой взгляд, код должен быть более читабельным, а не короче.

Кроме того, согласно тесту вариант old быстрее :

const filters = [];
for (let i = 1; i < 54; i += 1) {
    const currentDateDisplay = getStartDate(i, new Date().getFullYear());
    filters.push({ text: currentDateDisplay, value: currentDateDisplay });
}

Answer 4

Я должен согласиться, что 1-я реализация, которую вы написали, кажется более интуитивной, однако, 2-й метод может быть написан по-другому.

При первом вызове new Array(53) вы создаете массив из 53 элементов. Затем, вызвав .map((_, index) => {}), вы получите доступ к индексной переменной (используя _ для item, так как в любом случае undefined). Вам не нужно клонировать новый массив, распространяя его, поэтому простое использование этого кода будет работать для вас:

const filters = new Array(53).map((_, index) => ({
  text: getStartDate(index, new Date().getFullYear()),
  value: getStartDate(index, new Date().getFullYear())
}));