Почему не изменяется значение переменной?

Question

[Denis Chelpanov]

Почему не изменяется значение переменной totalAllProducts?
ajax возвращает корректные данные. Но totalAllProducts не изменяется

counterTotal() {
        let a = 0;
        let idProduct = 1;
        var totalAllProducts = 0;
        //get cart
        if ($.cookie('cart') != undefined) {
            var cart = JSON.parse($.cookie('cart'));
        } else {
            var cart = 0;
        }
        if (cart != 0) {
            for (var i = 0; i < cart.length; i++) {
                $.ajax({
                url: '/getProduct',
                type: "POST",
                data: {'id': cart[i].id},
                success: function(result) {
                		 totalAllProducts = totalAllProducts + Number(result);
                    }
              });
                // let total = cart[i].price * cart[i].quantity;
                // console.log(cart[i].price);
            }
            console.log(totalAllProducts);
        }
    }

Comments

[Yustas Alexu]

Такие вопросы тут появляются почти каждый день. Почитайте про асинхронную модель JS и про цикл событий. После прочтения больше таких вопросов не возникнет.

[origami1024]

ОП, не обижайся, загуглить слово "асинхронность" сходу при подобной проблеме могут только самый топ айку типо этих двоих

Answer 1

[Rsa97]

Потому что асинхронность.
Этот вопрос тут всплывает по два-три раза на неделе.
На момент вызова console.log данные ещё не пришли с сервера. По приходу данных будет вызван анонимный callback, указанный в success, тогда переменная и получит своё значение.

Answer 2

[coderisimo]

//стартовал запрос
      $.ajax({
        url: '/getProduct',
        type: "POST",
        data: {'id': cart[i].id},
        success: function(result) {
        // когда ответ будет получен ваш - console.log(totalAllProducts); уже выполнен и в нем ничего на тот момент не было!
          totalAllProducts = totalAllProducts + Number(result);
        // а если выводить результат здесь, все все будет работать.
        }
      });
   
  //запрос еще не завершен...ответ не получен , а мы уже пытаемся вывести что-то в консоль.
    console.log(totalAllProducts);

вывод - хотите обработать ответ с сервера - помещайте код в коллбэки.
success, done, fail, always . Посмотрите какие из них поддерживаются в вашей версии jQ