Как сохранить значение, сгенерированное циклом for, внутри массива

У меня есть следующий код


function getNumberWithCommas(number) {
  return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
}

   var price = [
  6599, 7659, 899, 569, 899, 279, 219, 1797, 3999, 2769, 599, 1349, 2149, 219,
  219, 519, 2499, 2949, 5149, 7689, 15999,
];
    
for (let i = 0; i < 20; i++) {
      var productPrice = document.createElement("span");
      productPrice.className = "price";
      productPrice.setAttribute("id", `price-id-${i}`);
      var calculatedPrice = price[i] * quantities[i];
      productPrice.textContent = `R$ ${getNumberWithCommas(calculatedPrice)},00`;
  precoTotalDiv.appendChild(productPrice);
        var totalPrice = [];
        totalPrice.push(calculatedPrice);
        console.info(totalPrice);
    }

Он динамически создает цены на товары в зависимости от их количества в корзине и их цены. Я хотел бы сохранить эти значения (calculatedPrice) внутри массива, чтобы получить общую цену (сумму всех цен) внизу корзины.

Он добавляет calculatePrice к totalPrice[], но добавляет только одно значение, длина массива остается единицей. Как только я нажимаю на другой продукт, calculatePrice перезаписывается ценой другого продукта. Я хотел бы получить сумму всех сгенерированных цен, а не сумму только одного продукта.

Так что поставьте array.push(calculatedPrice) в петлю.

Barmar 10.02.2023 02:55

Зачем вам нужен массив для вычисления суммы? Просто вставьте total += calculatedPrice в петлю.

Barmar 10.02.2023 02:56

Кстати, вы никогда не добавляете диапазон в DOM.

Barmar 10.02.2023 02:56

Я пытался, но сохраненное значение сбрасывается на цену другого товара.

Guchierrez 10.02.2023 02:57

Покажи, что ты пробовал. Мы не можем догадаться, что вы делаете не так.

Barmar 10.02.2023 02:57

Только что обновил пост тем, что пробовал. Надеюсь, это достаточно ясно.

Guchierrez 10.02.2023 03:13

Вы создаете новый массив на каждой итерации...

Dave Newton 10.02.2023 03:16

Я заметил, что это частая ошибка новичков.

Barmar 10.02.2023 16:42
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
8
53
3
Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

Это потому, что вы создаете новый массив в каждом цикле

Сначала объявите свой массив вне цикла:

    var totalPrice = [];
    
    for (let i = 0; i < 20; i++) {
          var productPrice = document.createElement("span");
          productPrice.className = "price";
          productPrice.setAttribute("id", `price-id-${i}`);
          var calculatedPrice = price[i] * quantities[i];
          productPrice.textContent = `R$ ${getNumberWithCommas(calculatedPrice)},00`;
          precoTotalDiv.appendChild(productPrice);
          totalPrice.push(calculatedPrice);
          console.info(totalPrice);
     }

Вы можете сохранить значения, сгенерированные циклом for, внутри массива в JavaScript, используя метод push массива. Вот пример:

// Initialize an empty array
var result = [];

// Use a for loop to generate values
for (var i = 0; i < 5; i++) {
  // Push the generated value to the array
  result.push(i);
}

// Print the final array
console.info(result);

Это выведет:

[0, 1, 2, 3, 4]
Ответ принят как подходящий

просто переместите let totalPrice = [] за пределы цикла:

Потому что, когда вы помещаете totalPrice внутрь цикла, оно будет сбрасываться в каждом цикле.

    var totalPrice = [];
    for (let i = 0; i < 20; i++) {
      var productPrice = document.createElement("span");
      productPrice.className = "price";
      productPrice.setAttribute("id", `price-id-${i}`);
      var calculatedPrice = price[i] * quantities[i];
      productPrice.textContent = `R$ ${getNumberWithCommas(calculatedPrice)},00`;
      precoTotalDiv.appendChild(productPrice);
      totalPrice.push(calculatedPrice);
    }
    console.info(totalPrice);

Другие вопросы по теме