Функция внутри setTimeout дает неопределенный

Question

Я хочу установить время ожидания после каждого вызова API.Поэтому я добавил setTimeout для вызова API для цикла for, но он предоставляет сервис API, который createAPIService не определен в setTimeout.Ниже мой код.

for (let i = 0; i < this.fooditemselecteddetails.length; i++) {
  this.spinnerService.hide();
  setTimeout(function() {
    this.common.createAPIService('api/booking/AddConcessions?CinemaId=' + this.cinemaid + '&TransactionId=' + this.temptransaction.TransactionId + '&ItemId=' + this.fooditemselecteddetails[i].id + '&Quantity=' + this.fooditemselecteddetails[i].quantity + "&BookingId=" + this.transactionAPIRequest.ORDER_ID, '')
  .subscribe((result: any) => {

      this.spinnerService.hide();
      this.addconcession = result;
      console.log(this.addconcession);


      if (this.addconcession.IsSuccess == true) {

        if (i == this.fooditemselecteddetails.length - 1) {
          localStorage.setItem("bookingid", this.transactionAPIRequest.ORDER_ID);
          this.common.createAPIService('api/booking/FinalBookingDetails?BookingId=' + this.transactionAPIRequest.ORDER_ID, '').subscribe((result2: any) => {
            this.vistavalidation = result2;
            if (this.vistavalidation.BookingID > 0) {
              this.common.createAPIService('api/booking/ContinueTransaction?CinemaId=' + this.cinemaid + '&TransactionId=' + this.temptransaction.TransactionId, '').subscribe((result3: any) => {
                if (result3.IsSuccess) {
                  this.ContinueTransactionresult = result3;
                  this.showTabOnClick('tabs-4');
                } else {
                  this.common.ShowNotification("Food Item", result3.Error, "info");
                  this.spinnerService.hide();
                }
              });
            } else {

              this.common.ShowNotification("Food Item", 'something went wrong, please try again', "info");
              this.spinnerService.hide();
            }
          });
        }
      } else {
        this.common.ShowNotification("Food Item", result.Error, "error");
        this.spinnerService.hide();

      }
    });
  }, 2000);

  console.log(this.addconcession);

}

Answer 1

Когда вы используете функцию стрелки, вы создаете замыкание.Замыкание - это внутренняя функция, которая имеет доступ к переменным внешней (включающей) функции - цепочке областей действия.Замыкание имеет три цепочки областей видимости: оно имеет доступ к своей собственной области видимости (переменные определены в его фигурных скобках), оно имеет доступ к переменным внешней функции и имеет доступ к глобальным переменным.

Подробнее здесь: http://javascriptissexy.com/understand-javascript-closures-with-ease/

Answer 2

заменить это "s etTimeout (function () {" на " setTimeout (() => {".

Answer 3

Используйте функцию стрелки, т.е. setTimeout(()=>{ },1000).Он унаследует this родительского элемента, и вы сможете получить доступ ко всем методам и переменным класса, используя this.

Answer 4

Попробуйте использовать синтаксис функции стрелки, чтобы сохранить область действия this

setTimeout(() => { вместо setTimeout(function() => {:

for (let i = 0; i < this.fooditemselecteddetails.length; i++) {
  this.spinnerService.hide();
  setTimeout(() => { ... }, 2000);

  console.log(this.addconcession);

}